使用 on()
方法添加的事件处理程序适用于当前及未来的元素(比如由脚本创建的新元素)。
这两者在绑定静态控件时没区别,但是绑定动态控件时只能用on()
。
下面的例子使用click()
时,后面追加的元素不会被删除,而使用on()
方式可以。
<div>
<button id="newon">用on生成的</button>
<button id="newclick">用click生成的</button>
<ul class="li">
<li>原来的html-on
<button class="del-on">删除</button>
</li>
<li>原来的html-click
<button class="del-click">删除</button>
</li>
</ul>
</div>
//两个添加
$("#newon").click(function(){
$(".li").append("<li>用on添加的<button class='del-on'>删除</button></li>")
});
$("#newclick").click(function(){
$(".li").append("<li>用click添加的(删除不了)<button class='del-click'>删除</button></li>")
});
//两个删除
$(".li").on("click",".del-on",function(){
$(this).parent().remove();
});
$(".del-click").click(function(){
$(this).parent().remove();
})
干一行,爱一行,学到老,活到老~~
网友评论