1. 程式人生 > >jQuery動態行綁定事件,發生重復綁定解決方案

jQuery動態行綁定事件,發生重復綁定解決方案

jquery 事件綁定 重復執行 多次執行

背景:

系統需要動態增加分類,各分類下有各自的3項資金(有資金小計,問題就出在這裏)。


問題:

新增一條分類,需要給3項資金新綁定小計功能。這個時候會發現,初始第一行的計算,會調用兩次,增加到三行的時候,第一行會重復計算三次,第二行會重復計算兩次...以此類推


為什麽會執行多次?


猜詞:

新增一行,綁定計算函數,歷史分類會累計事件。也就是說,每新增一行,歷史的每一個分類都會增加一次事件綁定。


方案:

綁定事件前,刪除事件。jQuery提供了on()、live()綁定方法,對應的解綁事件off()、die().


編碼:

// 調整之後的事件綁定
$(this).off(‘blur‘).on(‘blur‘,function(){
    alert(‘綁定前,解綁。保證事件唯一性‘);
});
/** 老的事件綁定
$(this).on(‘blur‘,function(){
    alert(‘直接綁定,遇到重復調用,會出現事件多次執行的異常,請確認只綁定一次。‘);
});*/



以上,就是jQuery事件綁定,出現重復多次執行問題的來龍去脈,謝謝大家。


----by.沫沫金

技術分享

jQuery動態行綁定事件,發生重復綁定解決方案