溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章將為大家詳細講解有關jQuery如何為DOM動態追加事件，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。
處理一個列表綁定，因為是一個展示項目，沒有使用復雜的插件，直接jsrender寫了個模板，但是后面有一個操作按鈕，去查看數據詳情，想到了jquery使用on進行事件委托，然后就開搞
最初是這樣寫的：
$(".btn-open").on("click", function () {
alert($(this).text());
})當然這樣是不起作用的，因為在document reday后，.btn-open 這個元素根本還不存在呢，列表沒綁定，事件當然也幫不上的！
然后是這樣的：
$(".table").on("click", ".btn-open", function () {
alert($(this).text());
})代碼可以看得明白，找到.table 元素，給.btn-open 追加 click事件。一般來說這樣就可以了。但是依然不行，我勒個去，我開始懷疑自己的記憶了。然后去找了下文檔。
文檔說：
事件處理只能綁定在當前被選中的元素上;而且，在您的代碼調用.on()的時候，他們必須在頁面文檔中已經存在。
好吧，在document ready時，.table確實不存在，所以 還要繼續改
$(document).on("click", ".btn-open", function () {
alert($(this).text());
})終于可以工作了。
總結：
1.jQuery委托事件與直接綁定事件的區別:
$(“X”).on(“click”,function(){})
$(“X”).on(“click”,”選擇X的子元素”,function(){})
2.事件處理只能綁定到當前存在的元素身上，也就是第一個選擇器中的內容必須當前存在（這也是為什么第二段代碼不起作用的原因，因為.table不存在），所以保險起見，可以直接綁定委托事件到document上。
關于“jQuery如何為DOM動態追加事件”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
