javascript - 更新购物车后 WooCommerce global.js 不起作用

Question

我在 global.js 中编写个人 JavaScript，直到我单击 WooCommerce 按钮 update_cart 后它才会起作用。

在我的功能不起作用之后。

该功能用于更新通知显示:

    $('#nb_article').change(function() {
        if ($('#nb_article').text() = 0) {
            $('#nb_article').css("display", "none");
        } else {
            $('#nb_article').css("display", "block");
        }
    });

它在应答器中jQuery(document).ready(function($) {}。

你知道我能做什么吗？

Answer 1

更新购物车操作在 woocommerce/assets/js/frontend/cart.js 上触发，查找 update_cart: function() {

它对表单的 url 进行 ajax 调用，然后使用 ajax 调用返回的 html 更新 .woocommerce div。所以，它不起作用可能是因为 $('#nb_article') 位于 .woocommerce 内部，并且该插件将替换所有 html，从而丢失事件。您应该在更新后重新应用事件处理程序。

或者，您可以通过委托(delegate)应用事件，如下所示:

$('.woocommerce').on( 'change', '#nb_article', function() {
    var $nb_article = $(this);

    if ( $nb_article.text() == 0) {
        $nb_article.css("display", "none");
    } else {
        $nb_article.css("display", "block");
    }
});