WooCommerce购物车改量仅首次自动更新，后续无响应问题排查

问题原因 #

核心问题出在WooCommerce的AJAX更新机制：当你触发"Update cart"按钮完成购物车更新后，WooCommerce会重新渲染整个购物车区域的DOM元素，包括数量输入框和更新按钮。虽然你用了事件委托绑定在.woocommerce上，但后续操作失效有两个关键原因：

1. AJAX更新完成后，新生成的"Update cart"按钮会被自动添加disabled属性（WooCommerce默认逻辑，无内容变化时禁用按钮），此时trigger("click")无法触发更新。
2. 代码未监听购物车更新完成的事件，无法在DOM重新渲染后重置按钮状态或确保交互正常。

修复后的代码 #

JavaScript代码（custom-cart.js） #

jQuery(document).ready(function($) {
    let timeout;

    // 初始隐藏Update cart按钮
    $("[name='update_cart']").hide();

    // 监听数量输入框的变化（覆盖手动输入和加减按钮操作）
    $(document).on('change input', 'input.qty', function() {
        // 清除之前的延迟任务，避免重复触发
        if (timeout) clearTimeout(timeout);
        
        timeout = setTimeout(function() {
            const updateBtn = $("[name='update_cart']");
            // 移除禁用属性，确保按钮能被触发
            updateBtn.removeAttr('disabled').trigger('click');
        }, 1000);
    });

    // 监听WooCommerce购物车更新完成事件，重新隐藏按钮
    $(document).on('updated_cart_totals', function() {
        $("[name='update_cart']").hide();
    });
});

PHP代码（无需修改，补充说明） #

你的PHP代码逻辑没问题，但需要确保：

• get_stylesheet_directory_uri() . '/js/custom-cart.js'路径正确，文件确实存放在子主题的js目录下。
• 修改代码后清除WordPress和浏览器缓存，避免加载旧版本的JS文件。

关键修改点说明 #

• 事件委托绑定到document：确保购物车DOM重新渲染后，依然能监听数量输入框的变化。
• 同时监听change和input事件：覆盖手动输入数量、点击加减按钮等所有修改场景。
• 移除按钮禁用属性：解决AJAX更新后按钮被禁用无法触发的问题。
• 监听updated_cart_totals事件：购物车更新完成后重新隐藏按钮，保持页面整洁。

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