在 WooCommerce 的结帐时禁用 AJAX

Posted 2023-02-24

【中文标题】在 WooCommerce 的结帐时禁用 AJAX

【英文标题】：Disable AJAX on checkout for WooCommerce

【发布时间】：2015-01-17 08:38:36

【问题描述】：

我想问一下如何在结帐页面（您输入运输和账单信息的地方）禁用 AJAX，而不是使用 AJAX 根据您的位置更新购物车摘要，它会通过自然更新刷新。

目前，当用户通过送货地点切换位置时，​​购物车摘要会自行更新，而无需重新加载页面。我想删除该 AJAX 并使用更新的信息重新加载页面。

我不太确定我应该指出什么样的代码或方向，但我已准备好提供任何必要的细节。让我知道！谢谢！！

【问题讨论】：

为什么要删除 Ajax？在 Woocommerce->Settings->Products->Add to cart 下有一个部分可以禁用 Ajax，但它可能不是您想要的。

@Robert Lee 我正在尝试删除 AJAX，因为它会覆盖我的翻译。我一直在寻找每次都翻译通过 AJAX 更新的内容的方法，所以我宁愿删除它并让页面重新加载每次翻译的正确内容。不幸的是，使用您所说的方法禁用 AJAX 只会在将产品添加到购物车时禁用 AJAX。

【参考方案1】：

所有 WooCommerce 字符串都已使用 wp_localize_script 正确本地化，因此我认为您可以通过创建适当的 .po/.mo 文件来正确翻译它们，但我承认没有很多翻译经验。供参考：所有可用的语言包都是at Github，您可能还想阅读documentation。

不管怎样，结帐脚本都在checkout.js。像任何脚本一样，只要您知道句柄，您就可以通过wp_dequeue_script() 将其出列。

function so_27023433_disable_checkout_script()
    wp_dequeue_script( 'wc-checkout' );

add_action( 'wp_enqueue_scripts', 'so_27023433_disable_checkout_script' );

【讨论】：

当你将一个脚本加入队列时会发生什么？

它不会在前端加载。请参阅法典文章。

【参考方案2】：

我遇到了类似的问题，我没有删除整个脚本，而是去查看事件的创建时间，发现了这个。

$( document.body ).bind( 'update_checkout', this.update_checkout );

看了一点之后，我发现由于命名空间的原因我无法解除绑定，所以我连接了on 事件，由于我无法阻止默认值，我停止了事件的传播。

这些解决了我的问题。

jQuery(document.body).on('update_checkout', function(e)
    //e.preventDefault();
    //e.stopPropagation();
    e.stopImmediatePropagation();
    //console.log(e);
);

【讨论】：

这是个好主意。希望您的事件在 WC 默认事件之前触发，否则我认为 e.stopImmediatePropagation 将停止剩余的挂钩函数，但不会停止已经执行的函数。显然，您可以检查 WC 挂钩其功能的那一刻，您可以更早地挂钩您的功能。所以是的，我认为它会起作用。

【参考方案3】：

如果您遵循 checkout.js 源代码的逻辑，您会注意到这些与编辑帐单|送货地址相关的 AJAX 操作可以通过更改结帐表单的类名安全地禁用。 是的，我知道，就是这么简单。因此，不要将form.checkout 改为form.checkout1，其中.checkout1 只是一个虚构的类名（它不必是真实的/存在的）。

下面是一个示例代码，可以帮助您了解所需内容：

var default_class = 'checkout';
var mask_class = 'checkout1';

// hijack the form's AJAX by changing form's default class name
$('form.'+default_class).addClass(mask_class).removeClass(default_class);

// restore the original class name whenever you want it
$('form.'+mask_class).addClass(default_class).removeClass(mask_class);

请注意，这是一个没有记录的 hack。但是，他们可能随时更改结帐表单功能，因此请记住这一点。我可以确认它适用于 WC 2.6.14，也可能适用于早期版本。

【讨论】：

关于这种方法的另一件事：确保恢复 body.checkout_error 上的默认类，否则您可能会遇到 JS 错误，因为 checkout.js 的 submit_error 函数将评估 $( 'form. checkout' ).offset() 会触发 ReferenceError 异常。

【参考方案4】：

我们遇到了类似的问题：在 quote list checkout 处加载了结帐脚本。再次通过另一个插件加载的脚本 (WooCommerce Germanized)。

我们的解决方案更明确：

在页面上配置自定义字段，您不希望加载结帐脚本。

比：

add_action('wp_enqueue_scripts', 'myprefix_dequeue_woocommerce_checkout', 10000);

function myprefix_dequeue_woocommerce_checkout() 
  if (get_post_meta(get_the_ID(), 'disable_woocommerce_checkout_scripts')) 
    wp_dequeue_script('wc-checkout');
    wp_dequeue_script('wc-gzd-checkout');
    wp_dequeue_script('wc-gzdp-checkout');
  

【参考方案5】：

一种不禁用 checkout.js 的方法。

首先可能会加载 checkout.min.js 而不是 checkout.js。

然后评论这两行：

update_checkout:function()
    //b.reset_update_checkout_timer(),
    //b.updateTimer=setTimeout(b.update_checkout_action,"5")
,

那么您的结帐页面将是无 ajax 的！

【讨论】：

我不知道这是否可行，但在第三方库（例如插件）中编辑代码是一种不好的做法。它可能会产生意想不到的结果，通常会大大增加维护时间，并且会在标准更新过程中丢失。