为什么“$(this.target).val()”（引用输入元素）的值“未定义”？

Question

这似乎是“Catch-22”的情况。

我已将“付款”类分配给了几个输入元素，如下所示：

<input class="payments" type="number" step="0.01" min="0" id="airfare" />

我正在响应这些元素的更改事件：

Template.templatizer.events({
      'change .payments' : function(event){
         var paymentTot = $('#paymenttotal').val();
         paymentTot = paymentTot + $(this).val();
         $('#paymenttotal').val(paymentTot);
      }
  });

...但使用上面的代码，在将一个值输入到“付款”类的元素之一并模糊/退出后，我得到，“未捕获的类型错误：无法读取未定义的属性 'toLowerCase'。 ”，显然是因为我需要在lenybernard的回答指出的“.TARGET”追加的元素在这里。

但是这样做之后，将代码更改为：

paymentTot = paymentTot + $(this.target).val();

...虽然这确实解决了“无法读取未定义的属性 'toLowerCase' ”问题，但在此行运行后，我得到“未定义”作为 paymentTot 的值（在此之前为“”）：

paymentTot = paymentTot + $(this.target).val();

如何避免“无法读取未定义的属性 'toLowerCase'”并从调用该事件的元素中获取值？

Answer 1

代替this, 使用event, 因为this将指向该函数，并且target实际上是在event通过参数传递给该函数的对象中：

paymentTot = paymentTot + $(event.target).val();