jQuery中的事件委派（代理事件）delegate
阿新 • • 發佈：2018-12-19
jQuery給我們提供了強大的js庫。我們可以用jQuery指令碼向頁面新增元素，隨著程式進行新增的元素怎麼新增事件呢？就需要使用delegate了。 delegate() 方法可以為已有或新新增的頁面元素繫結已定義的事件：
如下：
html:
<body>
<div>
<span>123</span><button>新增</button>
</div>
</body>
jquery:
$(function(){
//定義測試函式
function foo(){
alert($(this).text())}
//已有元素
$("div span").on('click',foo)
//點選按鈕新增新元素
$("div button").click(function(){
$("div").append("<span>123</span>")
})//給新元素繫結事件 $("div").delegate('span','click',foo) //$("div").undelegate('click') })
這樣就可以為新增的新元素繫結事件，並且原有的span元素會彈出兩次文字內容，證明delegate也給匹配到的當前的元素綁定了事件。
如果想要消除繫結很簡單：
$("div").undelegate('click')
刪除由delegate委派繫結的事件，不是通過delegate委派的事件則不會刪除。