获取有关“added_to_cart”javascript 事件的特定 WooCommerce 产品数据答案

【问题标题】：Get specific WooCommerce product data on "added_to_cart" javascript event获取有关“added_to_cart”javascript 事件的特定 WooCommerce 产品数据
【发布时间】：2020-07-07 17:39:46
【问题描述】：

在 WooCommerce 上，当客户使用 Ajax 添加到购物车时，我想实现以下事件跟踪脚本：

<script>
bianoTrack('track', 'add_to_cart', {
id: 'PRODUCT-1234',
quantity: 10,
unit_price: 123.45,
currency: 'CZK',
});
</script>

我知道我可以通过这种方式使用“added_to_cart”事件：

jQuery( 'body' ).on( 'added_to_cart', function( e, fragments, cart_hash, this_button ) {

});

但我不知道如何获取产品数据，如 sku、quantity、price...

如何在“add_to_cart”javascript 事件中获取特定的 WooCommerce 产品数据？

【问题讨论】：

作为新用户，您应该使用the quick tour (1 mn) 了解 StackOverFlow 的基本工作原理。

标签： php jquery ajax wordpress woocommerce

【解决方案1】：

首先，默认 WooCommerce added_to_cart Javascript 事件中的数据并不是所有必需的，但您可以通过自定义方式添加任意数量的数据。然后就很容易得到这些数据了。

代码如下：

// Add some product data to "add to cart" button for 'added_to_cart' js event
add_action( 'woocommerce_loop_add_to_cart_link', 'filter_wc_loop_add_to_cart_link', 10, 3 );
function filter_wc_loop_add_to_cart_link( $button_html, $product, $args ) {
    if( $product->supports( 'ajax_add_to_cart' ) ) {
        $search_string  = 'data-product_sku';
        
        // Insert custom product data as data tags
        $replace_string = sprintf(
            'data-product_name="%s" data-product_price="%s" data-currency="%s" %s',
            $product->get_name(), // product name
            wc_get_price_to_display( $product ), // Displayed price 
            get_woocommerce_currency(), // currency
            $search_string
        );

        $button_html = str_replace($search_string, $replace_string, $button_html);
    }
    return $button_html;
}

// The jQuery code that will handle the event getting the required  product data
add_action( 'wp_footer', 'added_to_cart_js_event' );
function added_to_cart_js_event(){
    ?>
    <script type="text/javascript">
    (function($){
        $(document.body).on('added_to_cart', function( event, fragments, cart_hash, button ) {
            var product_id    = button.data('product_id'),   // Get the product id
                product_qty   = button.data('quantity'),     // Get the quantity
                product_sku   = button.data('product_sku'),  // Get the product sku
                product_name  = button.data('product_name'), // Get the product name
                product_price = button.data('product_price'), // Get the product price
                currency      = button.data('currency');     // Get the currency
            
            
            bianoTrack('track', 'add_to_cart', {
                id: 'PRODUCT-'+product_id,
                quantity: product_qty,
                unit_price: product_price,
                currency: currency,
            });

            // For testing: View all product available data on console log (to be removed)
            console.log( button.data() );
        });
    })(jQuery);
    </script>
    <?php
}

代码进入您的活动子主题（或活动主题）的 function.php 文件中。经过测试并且可以工作。

其他一些相关答案：

【讨论】：