Meteor 教程：查看事件的所有属性答案

【问题标题】：Meteor Tutorial: see all properties of eventMeteor 教程：查看事件的所有属性
【发布时间】：2015-04-03 08:12:07
【问题描述】：

我正在关注Meteor 上的官方教程。我们正在将一个事件附加到一个模板（第 4 步）。

HTML

<form class="new-task">
 <input type="text" name="text" placeholder="Type to add new tasks" />
</form>

Template.body.events({
  "submit .new-task": function (event) {
    var text = event.target.text.value;

我收到建议添加一个 console.log(event) 来检查事件的所有属性。当我在 Chrome 控制台中添加 console.log(event) 时，我可以看到一个带有很多属性的 jQuery 事件树，但我似乎无法对存储在文本变量中的属性进行罚款。

我也尝试过 console.log(event.target) 和 console.log(event.target.text) 但都没有给我一个属性树和 console.log(event.target.text.value) 只是日志控制台的期望值。

我必须执行哪个 console.log(?) 才能找到 event.target.text.value 的路径？或者在 Chrome 控制台中看不到这个？

【问题讨论】：

【解决方案1】：

必须注意从 jQuery API 到 DOM API 的转换。输入的值不是事件的属性，而是属于 DOM 元素，可以通过 DOM API 访问。

在教程中，event.target 是我们在 HTML 中定义的表单。 event.target.text 访问 <input name="text"> 元素，这是一个 HTMLInputElement，不在 Meteor 的权限范围内。

从那里开始，您可以使用所有HTMLInputElement properties，包括value。

尝试在获得event.target.text.value 的行上设置断点，然后在控制台中键入event.target.text 以查看可用属性。

【讨论】：