event.target 在事件中未定义答案

【问题标题】：event.target is undefined in eventsevent.target 在事件中未定义
【发布时间】：2015-08-01 07:11:00
【问题描述】：

如何在events 中使用each 输入值？希望我下面的代码能很好地解释你。

HTML：

<template name="UpdateAge">
    {{#each Name}}
    <div data-action="showPrompt">
       <div>
          Some content
       </div>

       <div>
         <div>
            Some content
         </div>
       </div>
       <div>
           Name : {{name}}
           Age : <input type="text" name="age" value="{{age}}"/> //I need to access age values in event
       </div>
    </div>
{{/each}}
<template>

JS：

Template.UpdateAge.events({
  'click [data-action="showPrompt"]': function (event, template) {
        console.log(event.target.age.value); // TypeError: event.target.age.value is undefined
  }
});

我不知道我的方法是否适合将参数值传递给events，因此欢迎提出建议。

【问题讨论】：

好吧，您的错误消息并没有说 event.target 未定义，是吗？然而，几乎没有任何目标拥有.age 属性，因此访问.value 会抛出异常。
是的，<div> 并不会因此而神奇地获得.age 属性。

标签： javascript meteor handlebars.js meteor-blaze meteor-helper

【解决方案1】：

您使用的符号仅对表单元素有效，并且当 event.target 是表单元素时。

event.target.age.value

event.target 是事件发生的元素，event.currentTarget 是附加了事件处理程序的元素

如果您将div 替换为form 并将target 替换为currentTarget，那么它将起作用

event.currentTarget.age.value

here a fiddle 使用您的代码

【讨论】：

我将div 更改为form，但出现同样的错误。我认为没有提交表格。就我而言，我没有提交按钮。
event.target 是您单击的元素。所以如果点击输入框 event.target 是输入框，不是表单。表单元素将是currentTarget
谢谢，对我来说最好的方法，效果很好。这救了我的命:)

【解决方案2】：

如果事件绑定在容器 div 上，则应从目标搜索输入，因为event.target 将为您提供事件附加到的元素。

要访问 div 中的任何值，您必须首先访问该元素，然后使用该元素的属性来访问所需的任何内容 - 在本例中为 .value。

【讨论】：