Question

由于某些原因，禁用已添加到购物篮页面上的更新购物车按钮。我可以使用jQuery来获取按钮，但是即使我愿意，也可以将CSS应用于它，但我无法删除已禁用的按钮。

为什么禁用了禁用功能？如何删除它？

页脚内的我的js;

<script>
    jQuery(document).ready(function(){
        jQuery('#basket_page').find('button[name="update_cart"]').prop('disabled', false);
    });
</script>

检查器中的html按钮；

<button type="submit" class="button" name="update_cart" value="Update basket" disabled="">Update basket</button>

Answer 1

尝试使用jQuery删除属性：

jQuery('#basket_page').find('button[name="update_cart"]').removeAttr( 'disabled' )

Answer 2

我能够找出问题所在。在WooCommerce js文件中，有一个名为cart.js的文件。在此文件中，有一些代码可以检查输入是否已更改，是否已将其删除（在“更新购物车”按钮上已禁用），以便您可以更新购物车。因此，有些事情可能会与该代码冲突。可能的原因可能是；

您已经编辑了用于产品数量输入的模板文件，现在js不再能够检测到由于更改了结构/类等而发生的更改。
您已经创建了自己的js函数来处理数量输入，现在它们与cart.js发生冲突。

在我的情况下，这是原因2。我发现，如果我在js内抓取输入并在更改数量时将.change（）应用于它，则可以解决此问题。但是我宁愿不与cart.js冲突，以防以后出现问题，所以我只是使用其他方法来捕获输入更改。

我使用.on（'keydown keyup'）

而不是在输入上使用.change来捕获更改后的内容。

Answer 3

我也遇到了一些问题。当我查看cart.js时，发现了这一点：

$( document ).on(
                'change input',
                '.woocommerce-cart-form .cart_item :input',
                this.input_changed );

            $( '.woocommerce-cart-form :input[name="update_cart"]' ).prop( 'disabled', true );
        },

        /**
         * After an input is changed, enable the update cart button.
         */
        input_changed: function() {
            $( '.woocommerce-cart-form :input[name="update_cart"]' ).prop( 'disabled', false );
        },

很明显，要启用“更新”按钮，您需要更改数量输入值。然后查看事件触发器，它与.woocommerce-cart-form .cart_item :input绑定，这意味着它必须在每一行或每一行中都包含这两个元素。

就我而言，.cart_item在DOM中缺失，我认为这是woocommerce的错误，没有将cart_item类添加到表tr字段中。

所以解决方案：

add_filter( 'woocommerce_cart_item_class' , 'fixbug_cart_item_class' ,10 , 3 );
function fixbug_cart_item_class( $order_item, $item, $order) {
            $class = ' cart_item';


             return $class;

}

Answer 4

我遇到了同样的问题，我的情况是问题是对cart.php模板文件的修改，我删除了负责向cart-item s添加类的钩子。

因此，如果是这种情况，请在主题中找到购物车模板（yourtheme/woocommerce/cart/cart.php），然后在产品的 foreach 循环中找到包含购物车项目的过滤器课程。

<tr class="woocommerce-cart-form__cart-item <?php echo esc_attr( apply_filters( 'woocommerce_cart_item_class', 'cart_item', $cart_item, $cart_item_key ) ); ?>">

您可以找到this line originally in the template on Github（根据WooCommerce v3.6.2）

Answer 5

只需将此代码添加到您的 footer.php 文件中即可。即使您通过点击更新了购物车，它也会保持启用该按钮。

<script>
    jQuery(document).ready(function(){
        jQuery('.woocommerce-cart').find('button[name="update_cart"]').prop('disabled', false);

        jQuery('body').on('updated_cart_totals', function() {
            jQuery('.woocommerce-cart').find('button[name="update_cart"]').prop('disabled', false);

        })
    });
</script>

WooCommerce更新购物车按钮已被禁用

5 个答案: