jQuery動態(tài)添加的元素綁定事件處理函數(shù)代碼
更新時間：2011年08月02日 22:30:05 作者：
有一段時間沒用jquery了，今天又碰到這個問題。當(dāng)時是知道有l(wèi)ivejquery可以解決。但是我并不喜歡為了這個而另外加載一個。
我當(dāng)時的處理方法是在添加的時候手工綁定事件處理函數(shù)。不過新版的jquery已經(jīng)添加了這個功能。我們已經(jīng)不需要為此煩惱了。
參考：http://api.jquery.com/live/
以前我們定義事件，比如為元素定義單擊事件是這樣寫的：
$('input').click(function () {
//處理代碼
});
或
$('.clickme').bind('click', function() {
// Bound handler called.
});
但是這只能是對已經(jīng)加載好的元素定義事件，那些后來添加插入的元素則需要另行綁定。即使你使用jquery的clone函數(shù)，它并不能將事件也復(fù)制（到目前為止我還不清楚它是為什么這樣定義，是沒法復(fù)制還是刻意這么處理，以防止出現(xiàn)某些異常，這還有待去分析一下jquery的源代碼）。
現(xiàn)在，使用live你可以輕松搞定，
$('.clickme').live('click', function() { // Live handler called. });這樣，你即使在后面動態(tài)插入的元素，也會被綁定事件，$('body').append('<div class="clickme">Another target</div>');
參考：http://api.jquery.com/live/
以前我們定義事件，比如為元素定義單擊事件是這樣寫的：
復(fù)制代碼 代碼如下:
$('input').click(function () {
//處理代碼
});
或
復(fù)制代碼 代碼如下:
$('.clickme').bind('click', function() {
// Bound handler called.
});
但是這只能是對已經(jīng)加載好的元素定義事件，那些后來添加插入的元素則需要另行綁定。即使你使用jquery的clone函數(shù)，它并不能將事件也復(fù)制（到目前為止我還不清楚它是為什么這樣定義，是沒法復(fù)制還是刻意這么處理，以防止出現(xiàn)某些異常，這還有待去分析一下jquery的源代碼）。
現(xiàn)在，使用live你可以輕松搞定，
$('.clickme').live('click', function() { // Live handler called. });這樣，你即使在后面動態(tài)插入的元素，也會被綁定事件，$('body').append('<div class="clickme">Another target</div>');
您可能感興趣的文章:
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)移動端懸浮拖動，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-02-02
基于jQuery淡入淡出可自動切換的幻燈插件,原型是前幾天寫的一個幻燈效果,因?yàn)橐粋€小bug卡了兩天,然后清空之前寫的代碼,重新整理思路寫出來的.2010-09-09
這篇文章主要介紹了使用jQuery重置(reset)表單的方法,需要的朋友可以參考下2014-05-05
JS實(shí)現(xiàn)點(diǎn)擊生成UUID的方法完整實(shí)例【基于jQuery】
這篇文章主要介紹了JS實(shí)現(xiàn)點(diǎn)擊生成UUID的方法,結(jié)合完整實(shí)例形式分析了基于jQuery實(shí)現(xiàn)的隨機(jī)字符串生成相關(guān)操作技巧,需要的朋友可以參考下2019-06-06
jQuery插件Echarts實(shí)現(xiàn)的雙軸圖效果示例【附demo源碼下載】
這篇文章主要介紹了jQuery插件Echarts實(shí)現(xiàn)的雙軸圖效果,結(jié)合完整實(shí)例形式分析了Echarts插件制作雙軸圖效果的操作步驟與相關(guān)實(shí)現(xiàn)技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03
jQuery實(shí)現(xiàn)圖像旋轉(zhuǎn)動畫效果
jquery動畫旋轉(zhuǎn)效果在項(xiàng)目中經(jīng)常遇到這樣的需求，下面小編給大家分享具體實(shí)現(xiàn)代碼，感興趣的朋友一起學(xué)習(xí)吧2016-05-05
為Jquery EasyUI 組件加上清除功能的方法(詳解)
下面小編就為大家?guī)硪黄獮镴query EasyUI 組件加上清除功能的方法(詳解)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-04-04
這篇文章主要給大家介紹jquery事件處理的一些特征，jquery事件命名機(jī)制的相關(guān)知識，介紹的非常詳細(xì)，具有參考借鑒價值，感興趣的朋友一起看下吧2016-08-08
游戲力度條大家一定不陌生，在很多游戲中都能用到，本文介紹了jquery+Jscex打造游戲力度條，有需要的朋友可以了解一下。2016-10-10
Asp.net下使用Jquery Ajax傳送和接收DataTable的代碼
對于習(xí)慣使用GridView的人來說，前臺頁面需要動態(tài)添加表格的行數(shù)，是一件痛苦的事。GridView處理這種事情相當(dāng)麻煩，你點(diǎn)擊“新增一行”，需要回傳到服務(wù)器。2010-09-09