点击WooCommerce自动更新购物车

时间:2017-08-08 05:26:52

标签: php jquery wordpress woocommerce hook-woocommerce

我希望在数量更改时自动更新购物车。我在add_action( 'wp_footer', 'cart_update_qty_script' ); function cart_update_qty_script() { if (is_cart()) : ?> <script> jQuery('div.woocommerce').on('click', '.quantity .button', function(){ jQuery("[name='update_cart']").trigger("click"); }); </script> <?php endif; } 中获得了这个有效的代码,但它只适用于第一次点击。如何调整它以使其适用于每次点击?

messageBodyPart.setContent(htmlText, "text/html");

// second part (the image)
messageBodyPart = new MimeBodyPart();    

8 个答案:

答案 0 :(得分:1)

您可以使用下面的插件。

https://wordpress.org/plugins/woo-update-cart-on-quantity-change/

此插件也适合您。

https://wordpress.org/plugins/woocommerce-ajax-cart/

请使用插件以保证安全,因为插件适用于每个wordpress版本和woocommerce版本。

OR

您可以尝试使用下面的微小修改自定义代码。

add_action( 'wp_footer', 'cart_update_qty_script' );
function cart_update_qty_script() {
    if (is_cart()) :
        ?>
        <script type="text/javascript">
            jQuery(document).on("click", "div.woocommerce .quantity .button", function(e) {
               jQuery("[name='update_cart']").trigger("click"); 
            });

OR  
            jQuery("body").on("click", "div.woocommerce .quantity .button", function(e) {
                jQuery("[name='update_cart']").trigger("click"); 
            });
        </script>
        <?php
    endif;
}

答案 1 :(得分:1)

尝试这样..

add_action( 'wp_footer', 'cart_update_qty_script' ); 
function cart_update_qty_script() { 
    if (is_cart()) : 
    ?> 
    <script> 
        jQuery('body').on('click', 'div.woocommerce .quantity .button', function(){ 
            jQuery("[name='update_cart']").trigger("click"); 
        }); 
    </script> 
    <?php 
    endif; 
}

我是因为html正在被替换,div.woocommerce点击事件不再存在......如果你把它附加到身体上,它可能会有用......

答案 2 :(得分:1)

发生这种情况的原因是因为您的dom使用Ajax刷新并且事件被刷新。

您需要做的是收听事件'updated_cart_totals',它会告诉您dom已更新,之后会重新激活您的听众。

function quantity_upd() {
  $(".woocommerce-cart-form").on("change", ".qty", function() {
    $("[name='update_cart']").removeAttr('disabled');
    $("[name='update_cart']").trigger("click");
  });
}

$( document ).on( 'updated_cart_totals', function() {
  quantity_upd();
}

请根据您的主题和HTML调整它,它可以有所不同

答案 3 :(得分:0)

由于我不了解您的HTML结构,因此我构建了一个正在处理店面主题的示例jQuery。

以下是示例代码。

add_action( 'wp_footer', 'cart_update_qty_script' );
function cart_update_qty_script() {
    if (is_cart()) :
    ?>
    <script>
        jQuery('div.woocommerce').on('keyup', '.quantity .qty', function(){
            //console.log('clicked');
            jQuery("[name='update_cart']").trigger("click"); });
    </script>
    <?php
    endif;
}

答案 4 :(得分:0)

与其尝试触发单击,不如从“更新购物车”按钮中删除“禁用”属性,以便用户可以单击它。购物车页面已经可以通过这种方式工作,其中当更改项目上的数量时,“更新购物车”按钮变为可单击。

add_action( 'wp_footer', 'cart_update_qty_script' ); 
function cart_update_qty_script() { 
    if (is_cart()) : 
    ?> 
    <script> 
        jQuery('body').on('click', 'div.woocommerce .quantity .button', function(){ 
            jQuery("[name='update_cart']").prop("disabled", false);
        }); 
    </script> 
    <?php 
    endif; 
}

答案 5 :(得分:0)

页面加载时实际上未启用更新按钮,因此基本上需要在触发click事件之前将其启用。

使用此代码:

add_action( 'wp_footer', 'cart_update_qty_script' );
function cart_update_qty_script() {
  if (is_cart()) :
   ?>
    <script>
        jQuery('div.woocommerce').on('change', '.qty', function(){
           jQuery("[name='update_cart']").removeAttr('disabled');
           jQuery("[name='update_cart']").trigger("click"); 
        });
   </script>
<?php
endif;
}

答案 6 :(得分:0)

将此代码复制到函数:

function bbloomer_cart_refresh_update_qty() { 
   if (is_cart()) { 
      ?>      
      <script>
        jQuery('div.woocommerce').on('change', '.qty', function(){
            jQuery("[name='update_cart']").prop("disabled", false);
            jQuery("[name='update_cart']").trigger("click");
        });
        </script>
      <?php 
   } 
}

将此设置为样式:

button[name='update_cart'] {
display: none !important;
}

答案 7 :(得分:0)

仅在第一次单击时起作用的原因是因为每次更新表单时,它都会刷新自身。所以不要这样做:

jQuery('div.woocommerce').on('click', '.quantity .button', function() {

您需要将div.woocommerce切换为document

jQuery('document').on('click', '.quantity .button', function() {