jQuery中的事件委派（代理事件）delegate

發(fā)布時間：2020-03-04 14:45:59 來源：網(wǎng)絡(luò) 閱讀：829 作者：田頭草欄目：web開發(fā)

jQuery給我們提供了強大的js庫。我們可以用jQuery腳本向頁面添加元素，隨著程序進行添加的元素怎么添加事件呢？就需要使用delegate了。 delegate() 方法可以為已有或新添加的頁面元素綁定已定義的事件：
如下：
html:

<body>
<div>
<span>123</span><button>添加</button>
</div>
</body>

jquery:

$(function(){
//定義測試函數(shù)
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元素會彈出兩次文本內(nèi)容，證明delegate也給匹配到的當(dāng)前的元素綁定了事件。
如果想要消除綁定很簡單：

$("div").undelegate('click')

刪除由delegate委派綁定的事件，不是通過delegate委派的事件則不會刪除。

向AI問一下細節(jié)

jQuery中的事件委派（代理事件）delegate

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽