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

【问题标题】：Woocommerce add to cart validation hide alert messageWoocommerce 添加到购物车验证隐藏警报消息
【发布时间】：2020-01-27 10:17:44
【问题描述】：

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

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

更新

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

【问题讨论】：

标签： php wordpress woocommerce

【解决方案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 );
        }
    }
};

第二个是当前警报。所以我决定不重写这个原型，而是使用更简单的解决方案。我已经在单个产品的元位置有一个自定义表单。

<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>

所以我为错误消息添加了自定义跨度块，现在，如果我忘记填写表单中的所有选项，错误消息会显示三秒钟。这不是最好的解决方案，但效果非常好！

【讨论】：