Javascript ajax成功函數關閉多次

在我的項目中，我正在研究一個函數，該函數從表中刪除行，並使用.ajax()從數據庫中刪除行。當用戶點擊刪除按鈕時，我創建了我的功能。正如你所能理解的那樣，有幾行，每一行都有它自己的刪除按鈕。Javascript ajax成功函數關閉多次

現在，當用戶第一次點擊其中一個時，會彈出一個模式，顯示他/她是否確定要刪除該項目的問題。當他/她點擊是時，彈出消失並且該行淡出。這一切工作完美，但...

當你點擊一個第二刪除按鈕沒有刷新頁面，JavaScript的觸發斷電流要求刪除（和id）+德前一個。如果你第三次這樣做，它會觸發當前的和前兩個。

我試圖清空當前的var $(this).attr('data-page-id');，但它在.ajax()成功函數被觸發時仍然執行相同的操作。

$('a.btn-page-delete').click(function() { 

    var curPageId = $(this).attr('data-page-id'); 

    $('#delete-page').modal('show'); 

    $('a#action-confirm').click(function() { 

     $.ajax({ 

      type  : 'POST', 
      url  : '/pages/async/delete', 
      dataType : 'json', 
      data  : { page : curPageId }, 
      success : function(data) { 

       $('#delete-page').modal('hide'); 

       console.log(curPageId); 
       console.log(data); 

      }, 
      error : function() {} 

     }); 

    }); 

});

來源

2012-08-07 wpoortman

我以爲你看到的每一個*行被刪除時此行爲是因爲*，**你添加一個新的** Click事件處理程序爲'A＃行動confirm'。 – 2012-08-07 10:20:50

當您外單擊事件處理程序被調用

$('a.btn-page-delete').click(function() {

它會.bind()另一個click事件處理程序$('a#action-confirm')每次。所以，每次執行外部事件時，都會添加一個事件處理程序。

我敢肯定，你可以，也應該重新構建，並以更好的方式建造這一點，但在目前的狀態你唯一的選擇就是.unbind()/.off()內單擊處理程序，如

$('a#action-confirm').off('click').click(function() {

那將先前刪除通過jQuery綁定的任何點擊事件處理程序。

參考：.off()

來源

2012-08-07 10:20:45 jAndy

+1對於jAndy與dp :) – Jashwant 2012-08-07 10:24:50

@Jashwant：謝謝，但什麼是'dp'：P？ – jAndy 2012-08-07 10:25:40

是的，它的工作......但你將如何建立它。我的意思是，這是相當「好」的代碼吧？不管怎麼說，還是要謝謝你！ – wpoortman 2012-08-07 10:26:09

Javascript ajax成功函數關閉多次

回答

相關問題