jquery将click事件添加到动态创建的元素中

Question

我需要在我加载DOM后动态创建的列表项中添加一个click事件。

我正在使用;

$("#ListDiv li").live("click",function(event){
  do something......
 });

但是当元素加载到页面上并且我点击它时我什么都没得到。

这在Firefox中运行良好，但在IE8中运行不正常。我也试过jquery livequery和deleagte，但都没有用。我尝试使用IE8开发人员工具进行调试，但该方法永远不会到达

Answer 1

使用.delegate或.live并确保在DOM is ready后绑定：

$(document).ready(function () {
    $("#ListDiv").delegate("li", "click", function (event) {
        // do something
    });
});

编辑：

上述解决方案虽然仍然完全有效，但现在已经遗留/弃用。 jQuery之后引入了.on() method：

  

从jQuery 1.7开始，.on（）方法提供了所需的所有功能   用于附加事件处理程序。

该实现与上面发布的.delegate解决方案非常相似，但请注意参数的顺序已更改：

$(document).ready(function () {
    $("#ListDiv").on("click", "li", function (event) {
        // do something
    });
});

Answer 2

将您的代码推送到document.ready

中

 $(document).ready(function() {
       $("#ListDiv li").live("click",function(event){
        do something......
       });
     });