WordPress/WooCommerce加入购物车按钮失效，点击仅刷新页面（含缓存问题）

我查阅了15篇相关技术文章，都提到这个典型问题：在WooCommerce中点击「添加至购物车」按钮时，页面仅会刷新，商品无法正常加入购物车。

引发该问题的冲突因素非常多，包括主题JavaScript冲突、插件兼容性问题、自定义代码冲突、服务器配置限制等，但部分涉及核心业务功能的冲突项无法直接禁用。针对这种情况，我自研了一套无需禁用核心项的解决方案，分享给遇到同类问题的用户：

解决方案步骤 #

• 先通过浏览器开发者工具（F12）的「控制台」查看是否有JS报错，定位冲突的具体代码段
• 给WooCommerce的添加购物车按钮绑定自定义事件，绕过原有冲突的JS逻辑：

  jQuery(document).on('click', '.single_add_to_cart_button', function(e) {
      e.preventDefault();
      var product_id = jQuery(this).val();
      var quantity = jQuery('.quantity input').val() || 1;
      jQuery.post(wc_add_to_cart_params.wc_ajax_url.toString().replace('%%endpoint%%', 'add_to_cart'), {
          product_id: product_id,
          quantity: quantity
      }, function(response) {
          if (response.error && response.product_url) {
              window.location = response.product_url;
              return;
          }
          // 刷新购物车片段，更新页面显示
          jQuery(document.body).trigger('wc_fragment_refresh');
          // 可选：添加成功提示
          alert('商品已成功加入购物车');
      });
  });
  

• 将上述代码添加到主题的functions.php中（通过wp_enqueue_script加载）或直接添加到主题自定义JS区域
• 测试添加购物车功能，若仍有问题，检查服务器是否限制了AJAX请求，必要时调整php.ini中的max_execution_time和memory_limit参数

注意：使用前请备份主题文件，避免操作失误导致站点异常。

内容的提问来源于stack exchange，提问作者user77619