Question

我有woocommerce，单一产品页面，具有两个变体的变体产品。如果未选中其中一些（或全部未选中），则“添加到购物车”按钮将被禁用，并且我会收到有关该消息的警报。据我了解，它是一个功能 woocommerce_add_to_cart_validation 。我需要禁用警报消息，并在购物车数量和“添加到购物车”按钮之前显示此错误消息。据我了解，这是一个 woocommerce_before_add_to_cart_button 。我该怎么办？

我找到了一些有关如何自定义行为的解决方案，但是我没有找到如何隐藏警报消息。

更新

我说的是JS警报，当您按“添加到购物车”按钮时，该警报会出现，但格式无效。例如，我有一个带有大小和颜色的产品。我选择了颜色，但忘了选择尺码。添加到购物车按钮被禁用，如果我按下它，JS警报随消息出现，我需要填写表格。我想隐藏此JS警报弹出窗口，并将自定义错误消息放置在add_to_cart_button块之前。

Answer 1

我进一步调查了这个问题，发现该警报来自 /woocommerce/assets/js/frontend/add-to-cart-variation.js

我发现了这个功能

    VariationForm.prototype.onAddToCart = function( event ) {
    if ( $( this ).is('.disabled') ) {
        event.preventDefault();

        if ( $( this ).is('.wc-variation-is-unavailable') ) {
            window.alert( wc_add_to_cart_variation_params.i18n_unavailable_text );
        } else if ( $( this ).is('.wc-variation-selection-needed') ) {
            window.alert( wc_add_to_cart_variation_params.i18n_make_a_selection_text );
        }
    }
};

第二个是当前警报。因此，我决定不重写此原型，而使用更简单的解决方案。我已经在单个产品的meta位置中使用了自定义表格。

<script type="text/javascript">
jQuery( function($){
    $( '<span id="show_error">Please, fill all options!</span>' ).insertBefore( ".single_variation_wrap" );
    $('#show_error').hide();
    ...........

    $('.single_add_to_cart_button').on('click',function(e){
      if ( $( this ).is('.disabled') ) {
        e.preventDefault();
        if ( $( this ).is('.wc-variation-selection-needed') ) {
          $('#show_error').show();
          setTimeout(function () {
            $('#show_error').hide();
          }, 3000);
          return false;
        }
      }
    });


 });
</script>

因此，我为错误消息添加了自定义范围块，现在，如果我忘记填写表格中的所有选项，则错误消息将显示三秒钟。这不是最好的解决方案，但是效果很好！

Woocommerce添加到购物车验证隐藏警报消息

1 个答案: