jQuery .on多次觸發

我在代碼頁中使用了此代碼。當我點擊與.process_record類的按鈕，它給了我一個單一的警報，但如果我再次點擊同一個按鈕，它一次給我2警報。我不知道爲什麼它的行爲如此。jQuery .on多次觸發

$(".body .content").on("click", ".process_record", function(e){ 

     alert("clicked"); 
     var url = $(this).attr("data-url"); 
     $.post(url, function(data){ 
      $(".body .content").html(data); 
     },"html"); 
    })

來源

2013-07-26 TPSstar

什麼被附加到你的'$ .post'中？可能造成這種情況。 – tymeJV

每次點擊它時，最有可能再次綁定它，因此每次連續點擊都會導致每次點擊觸發一次額外的點擊事件。 –

這似乎是因爲通過$ .post加載的內容也有一個具有相同類的按鈕。我想通過該按鈕執行相同的操作，這就是爲什麼使用.on方法。 – TPSstar

http://jsfiddle.net/MaxPRafferty/z9VFA/

這正常工作對我來說在上面的小提琴。該HTML設置爲：

<div class="body"> 
    <div class="content"> 
     <input type="button" class="process_record" /> 
    </div> 
</div>

我的猜測是你設置處理程序多次，也許在另一個點擊事件。從您的評論中，您可能正在從您從其他頁面注入的腳本標記再次執行綁定，當您加載ajax時。您可能通過將腳本標記移動到其他頁面上的外部文件來解決此問題，然後在注入時確保只加載body標記，而不是頭部或腳本。

代碼解決方案是讓您的活動解除綁定並重新綁定自己的點擊，以確保只有一個處理器上的每個：

http://jsfiddle.net/MaxPRafferty/B5UPB/

var clickAction = function(){ 
    alert("clicked"); 
    $(".body .content").unbind("click"); 
    setClick($(".body .content"),clickAction); 
} 

var setClick = function(target,action){ 
    target.on("click", ".process_record",action) 
} 

setClick($(".body .content"),clickAction);

記住，這都將解除綁定$(".body .content")的事件，所以如果你只想卸載命名事件，請將取消綁定行更改爲$(".body .content").unbind("click",clickAction);

來源

2013-07-26 19:44:57 MaxPRafferty

jQuery .on多次觸發

回答

相關問題