Question

我想在WooCommerce中将特定产品添加到购物车时发出警告窗口。为此，我将添加一个单击功能到添加到购物车按钮，该按钮在ajaxComplete上触发。但是，ajaxComplete似乎会多次触发它。我该如何防止这种情况？

jQuery('#bvbutton').click(function() {
  jQuery( document ).ajaxComplete(function() {
    alert("testing!");
  });
});

编辑：这里的每个请求是一个更彻底的解释： ajax调用是在WooCommerce中进行的，我不想编辑它。我想要做的是给特定产品的按钮一个唯一的ID，并点击一个具有此id的按钮触发一个警告框。

重点是来自特定类别a内的物品应该对b类产品提供10％的折扣。从类别a添加产品时，警报框应该触发并通知类别b的折扣。因此，我为这些按钮指定了特定ID，并希望针对这些ID制作点击事件。点击后，我需要等待ajax调用，将项目添加到购物车，然后点火警告框。

希望现在有意义

Answer 1

$.ajaxComplete是全球性的。此处理程序将被调用多次添加到所有AJAX请求中。在您的情况下，每次单击#bvbutton时，全局添加另一个处理程序实例。

相反，在DOM ready事件中添加一次处理程序。不是任何特定的点击事件。

$(function() {
  jQuery( document ).ajaxComplete(function() {
    alert("testing!");
  });
});

Answer 2

我个人不会这样做，因为这会影响你所做的所有AJAX操作。当特定的AJAX过程成功时，我更倾向于使用trigger来触发自定义事件。通过这种方式，您可以更准确地了解警报何时消失。这是一个例子：

jQuery(document).on('product-added', function () {
  console.log('Product added');
});

jQuery('#bvbutton').click(function() {
  jQuery.ajax({
     url: endpoint,
     type: 'POST',
     ...
   }).success(function (data) {
     // process data
     jQuery(document).trigger('product-added');
   });
});

ajaxComplete多次触发 - woocommerce加入购物车

2 个答案: