JavaScript回調被保留在內存中並被新的回調取消

Question

我正在使用ajax處理CMS類型的項目。我的問題發生在位於這裏的notify.js javascript庫https://notifyjs.com/。

與我的本地副本，我意識到，我可以創建確切的按鈕圓滑設計，而無需使用javascript內置的alert（）或confirm（）方法。眼見提供源代碼沒有辦法明確由我修改了它我的意志，這裏的「回調」參數是我的自定義放慢參數

IE

//confirmation notification 
    Notification.prototype.confirm = function (style, position, title, text, callback) { 
     var icon = "fa fa-adjust"; 
     if (style == "error") { 
      icon = "fa fa-exclamation"; 
     } else if (style == "warning") { 
      icon = "fa fa-warning"; 
     } else if (style == "success") { 
      icon = "fa fa-check"; 
     } else if (style == "info") { 
      icon = "fa fa-question"; 
     } else { 
      icon = "fa fa-adjust"; 
     } 
     $.notify({ 
      title: title, 
      text : text + '<div class="clearfix"></div><br><a id="yesConfirmBtn" class="btn btn-sm btn-default yes">Yes</a><a id="noConfirmBtn" class="btn btn-sm btn-danger no">No</a>', 
      image: "<i class='" + icon + "'></i>" 
     }, { 
      style   : 'metro', 
      className  : style, 
      globalPosition: position, 
      showAnimation : "show", 
      showDuration : 0, 
      hideDuration : 0, 
      autoHide  : false, 
      clickToHide : false 
     }); 
     //listen for click events from this style 
     $(document).on('click', '.notifyjs-metro-base .no', function() { 
      // turn off event listener on yes click 
      $(document).off("click", '.notifyjs-metro-base .yes'); 

      //programmatically trigger propogating hide event 
      $(this).trigger('notify-hide'); 
     }); 
     var yesClick = function() { 
      //callback when user clicks 
      callback(); 
      // callback is assigned empty closure because on 
      // the next confirm request this callback and 
      // the new one will be called 
      callback = function(){ 

      }; 

      //hide notification 
      $(this).trigger('notify-hide'); 

     }; 
     $(document).on('click', '.notifyjs-metro-base .yes', yesClick); 
    } 

在點擊監聽器庫外添加回調我問題主要發生在yesClick監聽器上，因爲它會繼續將回調函數添加到另一個回調函數中，所以每次創建一個回調函數時都會觸發舊函數，然後觸發舊函數直到最新回調函數。

爲了通過這個問題，我將回調函數指向了一個空的匿名函數，所以當舊函數被執行時，它將不會執行任何操作，但這種方式仍然不能解決我的問題，因爲回調函數仍然會在內存中。

傳入的回調會執行一個Ajax請求來刪除數據庫中的一行。

這是回調的樣子

var self = this; 
// triggers notify.js confirmDelete() method passing in the 
// body, title, and callback 
this.notif.confirmDelete("Are you sure?", "Delete this Item?", function() { 
    // creates a notification to show user their 
    // transaction is being processed 
    self.notif.info("Deleting"); 
    // callback for if the ajax request was successful 
    var successCB = function (text) { 
     if (text.indexOf("true") !== -1) { 
      self.notif.success("Item has been deleted", "Successfully Deleted"); 
      var form = new Validate(), 
       table = new Table(); 
      form.resetForm(); 
      table.removeRow(data.id); 
     } else { 
      self.notif.error("Could not be deleted..."); 
     } 
     // callback if ajax request failed 
    }, failCB  = function() { 
     // this key word refer's to a method called 
     //Success which is the same as successCB as they 
     //are placed in the same object literal 
     this.Success("false"); 
    }; 
    self.ajaxRequest(successCB, failCB, data); 
}); 

self.ajaxRequest看起來是這樣的（這是一個自定義的Ajax庫我提出如果它似乎stranged）

var self   = this; 
var dataToProcess = data || {}; 
// basic set up for ajax request 
Ajaxify({ 
    host  : self.hostName + "Backend/manage/" + self.processFile, 
    data  : [dataToProcess], 
    responseType: "text", 
    method  : "POST", 
    execute  : true,// executes request right away 
    Success  : successCallback, 
    Failure  : failureCallback 
}); 

我在做什麼錯？

我該如何解決這個問題？

它的原因是什麼？

（注意：如果需要更多信息，請告知我） 謝謝！

Answer 1

您需要刪除點擊事件與關閉，因爲你加入全球點擊與

function noClick() { 
     //programmatically trigger propogating hide event 
     $(this).trigger('notify-hide'); 
     removeEvents(); 
    } 
    function removeEvents() { 
     $(document).off('click', '.notifyjs-metro-base .no', noClick); 
     $(document).off('click', '.notifyjs-metro-base .yes', yesClick); 
    } 
    $(document).on('click', '.notifyjs-metro-base .no', no); 
    function yesClick() { 
     //callback when user clicks 
     callback(); 

     //hide notification 
     $(this).trigger('notify-hide'); 
     removeEvents(); 
    }; 
    $(document).on('click', '.notifyjs-metro-base .yes', yesClick);