只執行completeAjax一次

Question

我需要在頁面上完成已經運行的ajax時觸發一個函數。我想要更新的功能會更新心願單項目計數器，並且之前運行的功能會將項目保存到心願單中。

問題是（我已經想通了） - 在等待成功消息時（初始化）ajax請求後，該函數再次執行自身。

底線，我希望ajaxComplete函數部分只能運行一次。請點我在正確的方向

jQuery(document).ready(function() { 

    var token = false; 

    jQuery('.add_to_wishlist').on('click', function() { 

      if(token == false) { 

       jQuery(document).ajaxComplete(function() { 

        console.log('Entered Click!'); 

        token = true; 

        jQuery.ajax({ 

         url: wishajax.ajax_url, 
         data: { 
          action: 'vg_inject_wish', 
         }, 
         success: function(response) { 

          console.log('Entered Success!'); 

          jQuery('.wishlist-container').html(response); 

          console.log('After Success!'); 

          token = true; 

         } 

        }); 

       }); 

      } 
    }); 

}); 

Answer 1

jQuery(document).ajaxComplete是一個獨立的event。你爲什麼把它結合在click事件裏面並且再次寫入jQuery.ajax呢？單獨作爲以下擔憂：

jQuery(document).ajaxComplete(function() { 
    token = true;//If you need this only in success then no need to put it here as this 
    //will get executed irrespective of ajax result 
}); 

jQuery('.add_to_wishlist').on('click', function() { 
    if(token == false) { 
      jQuery.ajax({ 
       url: wishajax.ajax_url, 
       data: { 
         action: 'vg_inject_wish', 
       }, 
       success: function(response) { 
         console.log('Entered Success!'); 
         jQuery('.wishlist-container').html(response); 
         console.log('After Success!'); 
         token = true; 
       } 
      }); 
    } 
}); 

Answer 2

也許這可以幫助你

function once(fn, context) { 
    var result; 

    return function() { 
     if(fn) { 
      result = fn.apply(context || this, arguments); 
      fn = null; 
     } 

     return result; 
    }; 
} 

// Usage 
var canOnlyFireOnce = once(function() { 
    console.log('Fired!'); 
}); 

canOnlyFireOnce(); // "Fired!" 
canOnlyFireOnce(); // nada 

從blog of David Walsh拍攝。