WooCommerce在单个产品页面中的addd_to_cart委托事件

Question

在Woocommerce中，当我单击单个产品页面中的“添加到购物车”按钮时，该产品已成功添加到购物车。现在，将产品添加到购物车后（重新加载页面后），我想触发在框中弹出的 CHECKOUT 和 SEE CART 按钮的显示。

以下代码可在 AJAX ADD A CART 上正常工作，但不适用于 SINGLE ADD TO CART ，因为未启用Ajax：

$( document.body ).on( 'added_to_cart', function(){
    console.log('added_to_cart');
}); 

我如何使其适用于非单次添加到购物车？

Ajax添加到购物车 （工作） ：https://test.sushi2500.dk/takeaway/nigiri-laks/
一次添加到购物车 （无效） ：https://test.sushi2500.dk/takeaway/maanedstilbud/

Answer 1

在单个产品页面上，由于数据是使用“发布”方法 （不涉及JS / AJAX）在表单上提交的，因此您可以检测到“添加到使用PHP contentController.renderer(nodeFor: faceAnchor) 变量的购物车”事件，方法是：

$_POST

代码进入您的活动子主题（或活动主题）的function.php文件中。

已针对单个产品页面（如果使用add_action('wp_footer', 'single_added_to_cart_event'); function single_added_to_cart_event() { if( isset($_POST['add-to-cart']) && isset($_POST['quantity']) ) { // Get added to cart product ID (or variation ID) and quantity (if needed) $quantity = $_POST['quantity']; $product_id = isset($_POST['variation_id']) ? $_POST['variation_id'] : $_POST['add-to-cart']; // JS code goes here below ?> <script> jQuery(function($){ console.log('added_to_cart'); alert('added_to_cart'); }); </script> <?php } } 短代码，例如）进行了测试并可以工作。

您可以在模板，自定义函数（或自定义简码）中使用代码。

Answer 2

$( document.body ).on( '.wc-variation-selection-needed', function(){

      console.log('added_to_cart');

}); 

尝试一下

Answer 3

通过这种方法，我相信您可以在单个页面上触发added_to_cart事件，从而避免了在未将产品未添加到购物车的情况下无意触发的问题已通过woocommerce_add_to_cart_validation过滤器进行了验证。

您可以通过woocommerce_add_to_cart钩子将任何其他参数传递给事件，例如产品ID，数量，变体ID等。

如果added_to_cart事件不适合您，则可以根据需要触发自己的自定义事件。

add_action( 'woocommerce_add_to_cart', 'trigger_single_added_to_cart_event', 10, 6 );
function trigger_added_to_cart_event_in_single_product_page() {
    $params = func_get_args();
    add_action( 'wp_footer', function () use( $params ) {
        ?>
        <script>
            jQuery(function ($) {
                $(document.body).trigger({
                    type: 'added_to_cart',
                    product_id:<?php echo esc_attr( $params[1] ) ?>,
                    quantity:<?php echo esc_attr( $params[2] ) ?>
                });
            }); 
        </script>
        <?php
    } );
}