1. 程式人生 > >jQuery 新新增元素事件繫結無效

jQuery 新新增元素事件繫結無效

 

jQuery中事件繫結,大多使用on就足夠了。

但是對於新新增的元素 on 的繫結事件 會不起作用。

因為 append 中的 節點是在整個文件載入之後才新增的,頁面並不會為未來的元素初始化新增點選事件,因此 這種方式新增的 節點的點選事件是無效的。

解決方法:

事件委託。事件委託就是利用事件冒泡的原理,把事件新增到父元素或祖先元素上,觸發執行效果。

原始碼:

1 $('#ul li').on('click', function() {
2     alert($(this).html())
3 })

修改為:

$(document).on('click', '#ul li', function
() { alert($(this).html()) })