Question

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

的CoffeeScript

$(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检查附加的处理程序到$('#dynamic').data('events')元素。如果它未定义，那么你还没有绑定任何处理程序，但如果它返回一个对象，那么你已经绑定了一些事件。

Answer 2

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

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

jquery .on（）触发事件两次

2 个答案: