jquery将点击事件添加到动态创建的元素

Question

我需要添加一个点击事件到我加载DOM后动态创建的列表项。

我正在使用;

$("#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中，。对（）方法提供用于附接的事件处理程序所需 所有功能。

实现相当类似.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...... 
     }); 
    });