欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

解決jquery中動(dòng)態(tài)新增的元素節(jié)點(diǎn)無法觸發(fā)事件問題的兩種方法

 更新時(shí)間：2015年10月30日 14:36:05   投稿：lijiao  
這篇文章主要分享了解決jquery中動(dòng)態(tài)新增的元素節(jié)點(diǎn)無法觸發(fā)事件問題的兩種方法，感興趣的小伙伴們可以參考一下

比如做一個(gè)ajax讀取留言列表的時(shí)候，每條留言后面有個(gè)回復(fù)按鈕，class為“reply”,如果你用的是$(".reply").click(function(){ //do something... })，想必后面通過ajax加載進(jìn)來的列表中的回復(fù)按鈕，點(diǎn)擊事件會(huì)失效。

其實(shí)最簡(jiǎn)單的方法就是直接在標(biāo)簽中寫onclick=""，但是這樣寫其實(shí)是有點(diǎn)low的，最好的方式還是通過給類名綁定一個(gè)click事件。

解決jquery中動(dòng)態(tài)新增的元素節(jié)點(diǎn)無法觸發(fā)事件的問題有兩種解決方法，如下：

為了達(dá)到更好的演示效果，假設(shè)在某個(gè)頁面的body下有以下結(jié)構(gòu)的代碼：

<p id="pLabel">新加一條</p>
<ul id="ulLabel">
 <li class="liLabel">aaa1</li>
 <li class="liLabel">aaa2</li>
 <li class="liLabel">aaa3</li>
</ul>
<script type="text/javascript">
$("#pLabel").click(function(){
 $("#ulLabel").append('<li class="liLabel">aaaQ</li>'); //動(dòng)態(tài)像ul的末尾追加一個(gè)新元素
});
</script>

方法一：使用live

live()函數(shù)會(huì)給被選的元素綁定上一個(gè)或者多個(gè)事件處理程序，并且規(guī)定當(dāng)這些事件發(fā)生時(shí)運(yùn)行的函數(shù)。通過live()函數(shù)適用于匹配選擇器的當(dāng)前及未來的元素。比如，通過腳本動(dòng)態(tài)創(chuàng)建的元素。

實(shí)現(xiàn)如下：

$('.liLabel').live('click', function(){
 alert('OK');
});

方法二：使用on

可以通過on方法綁定事件，可以綁定到它的父級(jí)或者body中，實(shí)現(xiàn)如下：

$("#ulLabel").on('click','.liLabel',function(){
 alert('OK')
});
或者：
$("body").on('click','.liLabel',function(){
 alert('OK')
});

現(xiàn)在大家可以嘗試嘗試，是不是問題已經(jīng)得到解決了，希望這篇文章能夠真正的幫助大家。

相關(guān)文章

最新評(píng)論