场景: 使用$(xxx).click();绑定了ajax请求后追加的html代码中的某个元素时。出现事件失效的情况,这是因为绑定事件代码在元素出现之前就已经执行
>解决方法:可以使用live替代click,但是live方法在1.7中已经不建议使用,在1.9中删除了这个方法,并建议使用on方法来替代。具体实现demo如下:
<body>
<button id="btn1">BTN1</button>
</body>
<script type="text/javascript">
/* 在id=btn1后面添加按钮 */
function addBtn(){
var btn = $("<button></button>").append("BTN2").attr("id", "btn2");
$("#btn1").after(btn);
}
$(function(){
/* 2秒之后执行添加按钮方法 */
setTimeout("addBtn()", 2000);
/* 给新添加按钮绑定click事件 */
$(document.body).on("click","#btn2", function(){
alert("Hello Jquery !");
});
});
</script>