Question

我无法将jQuery事件绑定到动态创建的列表项。

btnRemoveItem上的事件在jQuery开始添加后没有触发。

$('#btnAddStore').on('click', function(){
  (...)
  $.ajax({
    success: (function(result) {
      (...)
      var li = jQuery('<li/>', {
          'id': object['id']
         }).append('<span title="Remove item from list" class="btnRemoveItem"></span>')
           .append('<span class="text">' + name_adr[0] + '</span>')
           .append('<span class="address">' + name_adr[1] + '</span>');

      $(li).appendTo('#'+ country + ' ul');
    }
  });
});

我在这里看过类似的问题，但是我没有找到解决问题的答案。我在这段代码中遗漏了什么？

Answer 1

以这种方式使用.on()

$(document).on('click','#btnAddStore', function(){...});

Answer 2

试试这个

$(document).on('click','#btnAddStore', function(){...});

$('#btnAddStore').on("scroll", ....)仅将滚动事件绑定到执行此语句时出现的那些元素，即如果在执行此语句后动态添加任何带有类wrapper1的新元素，则事件处理程序将不会为这些元素执行。

另一方面，

$(document).on("scroll","#btnAddStore", ...)将向文档对象注册一个事件处理程序，并且只要在具有类`wrapper``的元素内发生滚动，就会使用事件冒泡来调用处理程序，因此它将支持动态添加元素。

See here

Answer 3

将委托与.on（）：

一起使用

$(document).on('click', '#btnAddStore', function(){...});

动态创建的内容不绑定jQuery事件

3 个答案: