Question

现在，我理解为了将事件监听器附加到动态添加的元素，您必须在添加元素后重新定义监听器。有没有办法绕过这个，所以你不必执行一整堆额外的代码？

Answer 1

使用.on()，您可以定义一次函数，它将针对任何动态添加的元素执行。

例如

$('#staticDiv').on('click', 'yourSelector', function() {
  //do something
});

Answer 2

$(document).on('click', 'selector', handler);

其中click是事件名称，handler是事件处理程序，类似于对函数或匿名函数的引用function() {}

PS：如果您知道要添加动态元素的特定节点，则可以指定它而不是document。

Answer 3

您正在动态生成这些元素，因此在页面加载时应用的任何侦听器都不可用。我已经用正确的解决方案编辑了你的小提琴。基本上，jQuery通过将事件附加到父元素并将其向下传播到正确的动态创建元素来保存事件以供稍后绑定。

$('#musics').on('change', '#want',function(e) {
    $(this).closest('.from-group').val(($('#want').is(':checked')) ? "yes" : "no");
    var ans=$(this).val();
    console.log(($('#want').is(':checked')));
});

http://jsfiddle.net/swoogie/1rkhn7ek/39/

Answer 4

使用jquery插件调用添加新元素时，您可以执行以下操作：

$('<div>...</div>').hoverCard(function(){...}).appendTo(...)

Jquery将事件侦听器添加到动态添加的元素中

4 个答案: