關於jquery中動態添加節點后,直接操作節點會沒有反應的問題


    前幾天遇到一個問題,當我點擊添加規章制度的時候,再增加規章制度的幾個節點,同時每個規章制度都是可以增加也可以刪除的,增加是很好解決的,當點擊增加按鈕的時候,通過創建節點的方法,直接創建就解決了,但是在刪除的時候就出現問題了,當我找到刪除按鈕點擊刪除是沒有反映的,后來通過查閱資料得到,在jquery動態添加的節點的操作,要通過事件委托的方法才能獲得所操作的節點,所以要操作動態添加的數據必須通過數據委托的方式實現,啥也不說了,上代碼與截圖。

可以點擊增加可以刪除,直接點擊刪除是不可行的,只有通過實踐委托的方式,js代碼為一下:

//當點擊增加新規章制度的時候
var count =0;
$('.rule_add').click(function(){
count++
var rule_list = $('<div class="parcel"><div class="publicity"><div class="publicity_center"></div><div class="publicity_left"><span class="publicity_top"></span><input type="file" class="publicity_top" name="upload_pdf['+count+']["aa"]"></div><div class="publicity_right"></div></div><input type="text" class="publicity_one" name="upload_pdf['+count+']["bb"]" placeholder="請輸入規章制度名(務必與文件內容保持一致)"><input type="text" class="publicity_two" name="upload_pdf['+count+']["cc"]" placeholder="共_____項"><input type="text" class="publicity_three" name="upload_pdf['+count+']["dd"]" placeholder="制定時間時間:_____年_____月_____日"></div>');
rule_list.insertBefore($('.rule_add'));
});
//當點擊刪除公示規章制度的時候
$('.rule_publicity').on('click', '.publicity_right',function() {
//這里是保證最后一個是不能刪除的,
if($('.parcel').size()>1){
$(this).parent().parent().remove();
}

});

     在時間委托的過程中,做好找到已經存在的直接父節點,這樣可以快速的定位,減少資源的浪費。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM