這兩天工作中遇到使用js動態(tài)加載內(nèi)容，同時需要對加入的內(nèi)容綁定點(diǎn)擊事件的，當(dāng)時想想了想可以使用內(nèi)聯(lián)的onclick 來實(shí)現(xiàn)，后來沒有這樣做，使用的是 on(‘click',function(){}) ,然而使用on方法的時候就發(fā)現(xiàn)，on 對同一個元素多次綁定同一個事件的時候，這個事件就會執(zhí)行多次。

下面給出這種情況的實(shí)例：

$(function(){  $(".add").click(function(eve){   $(".btn-area").append("<button class='test-btn'>test button</button>");   //$(".test-btn").off("click");   $(".test-btn").on("click",function(){    console.log("test button .....");   });  });});

在點(diǎn)擊add按鈕的添加測試按鈕，測試按鈕綁定點(diǎn)擊事件，console 臺輸出一句話。

執(zhí)行結(jié)果如下：

很明顯，第一個按鈕點(diǎn)擊之后執(zhí)行了5次。

遇到這種情況需要在每次綁定事件之前，對該事件解綁，也就是 $(“.test-btn”).off(“click”); ，off方法解綁。

以上這篇Jquery on方法綁定事件后執(zhí)行多次的解決方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持武林網(wǎng)。