jquery .on() 触发事件两次

Question

我有一些动态生成的表单域。我想根据刚刚更改的值更新输入字段。摆弄下面的代码后，事件似乎触发了两次（因为警报触发了两次）。第一次触发改变了我想要的文本字段，但是在第二次触发时将其更改为零。为什么下面的代码会触发两次？我怎样才能防止这种情况发生？

咖啡脚本

$(document).on 'change','#qty', ->
  $('#amount').val($(this).val())
  alert($(this).val())

Javascript 等价于上述

$(document).on('change', '#qty', function() {
  $('#amount').val($(this).val());
  return alert($(this).val());
});

Answer 1

on() 函数没有问题。见this fiddle。

代码：

$('body').append($('<input>').attr('id', 'dynamic'));
$(document).on('keyup', '#dynamic', function(e) {
    console.log(e, e.target);
    /*
    Since all functions in JavaScript has a return value, 
    and if you don't specify them they would default to undefined, 
    thus you might return something explicitly here. 
    But it has no effect upon the execution of the on() function.
    */
});

我猜你绑定了偶数处理程序两次。这是最有可能的情况。为了测试这一点，我建议您首先使用$('#dynamic').data('events') 检查#dynamic 元素的附加处理程序。如果它是未定义的，那么你还没有绑定任何处理程序，但如果它返回一个对象，那么你已经绑定了一些事件。

Answer 2

由于每次添加元素时都在运行代码，因此只需直接绑定即可。

$("#qty").on("change",...