添加到购物车之前添加到购物车按钮上的 javascript woocommerce 表单验证

Question

我有一个自定义页面，其中显示带有变体的产品、自定义字段和添加到购物车按钮。 单击添加到购物车按钮时，我需要在 javascript 中触发一些验证，但如果表单未验证，则无法执行添加到购物车。

我想知道是否可以实现。

首先，我尝试按照此处的说明进行操作： WooCommerce add to cart validation: prevent add to cart

它运行良好，我希望能够使用此代码，但对我来说不可能，因为： - 我使用的是自定义页面，而不是通常的 woocommerce 产品页面 - 这意味着验证后，我将被重定向到空白的标准 woocommerce 页面

这就是为什么我真的需要使用 Javascript 来执行此操作： - 添加到购物车点击时触发的 javascript 或 jquery 函数 - 然后函数检查一切正常 - 如果是，则可以将产品添加到购物车 - 如果否，则会显示警报并且用户保持在同一页面上，没有任何内容添加到购物车。

我尽量说清楚。 希望我能得到一些帮助。

非常感谢。

Answer 1

请试试这个方法：

function so_validate_add_cart_item( $passed, $product_id, $quantity, $variation_id = '', $variations= '' ) {
<script>
  jQuery(function($){
       jQuery(document).on('click', '.single_add_to_cart_button', function (e) {
            e.preventDefault();
            // your validation here
       });  
    });
</script>
}
 add_filter( 'woocommerce_add_to_cart_validation', 'so_validate_add_cart_item', 10, 5 );