Question

我正在研究WordPress WooCommerce主题，但我遇到了一个问题.. 我已经制作了数量增量按钮，但是在点击事件之后我想触发更新购物车按钮但是WooCommerce禁用该按钮，并且需要在数量输入字段上发生更改事件。我试过.trigger（'change'）和.change（）。两个都没用，你可以帮帮我吗？

$('.quantity').on('click', '.plus', function(e) {
  $input = $(this).prev('input.qty');
  var val = parseInt($input.val());
  var step = $input.attr('step');
  step = 'undefined' !== typeof(step) ? parseInt(step) : 1;
  $input.val(val + step).trigger('change');
});
$('.quantity').on('click', '.minus', function(e) {
  $input = $(this).next('input.qty');
  var val = parseInt($input.val());
  var step = $input.attr('step');
  step = 'undefined' !== typeof(step) ? parseInt(step) : 1;
  if (val > 0) {
    $input.val(val - step).trigger('change');
  }
});

$('.qty').on('change', function() {
  alert('.qty has changed!');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="quantity">
  <input class="minus" type="button" value="-">
  <input type="number" step="1" min="0" max="" name="cart[256a54619faec7a3f96b726a46dae520][qty]" value="1" title="Qty" class="input-text qty text" size="4" pattern="[0-9]*" inputmode="numeric">
  <input class="plus" type="button" value="+">
</div>

在这个片段中它可以工作，但是在我的localhost上它不是

Answer 1

试试这个：

$('.quantity input').on('click', function(e) {
  $input = $(this).parent().find("input.qty");
  var step = $input.attr('step');
  var val = parseInt($input.val());
  step = 'undefined' !== typeof(step) ? parseInt(step) : 1;

  if( $(this).val() == "+" ) {
    $input.val(val + step);
  } else {
    $input.val(val - step);
  }

  $input.trigger("change");
});

$('.qty').on('change', function() {
  alert('.qty has changed!');
});

Answer 2

这是最简单的解决方案，可以在更改数量时强制购物车更新，而无需点击“更新购物车”按钮。请注意，当按钮为disabled

时，它也可以使用

add_action( 'wp_footer', 'wp_cart_refresh_update_qty' ); 
function wp_cart_refresh_update_qty() { 
    if (is_cart()) { 
        ?> 
        <script type="text/javascript"> 
            jQuery('div.woocommerce').on('change', '.quantity input', function(){
                jQuery("[name='update_cart']").removeAttr('disabled');
                jQuery("[name='update_cart']").trigger("click"); 
            }); 
        </script> 
        <?php 
    } 
}

.trigger（“改变”）不起作用

2 个答案: