使用WooCommerce为我们提供的JS Events插入自定义JavaScript事件

WooCommerce中的JSEvents

在开发WooCommerce主题或插件时，我们难免要和用到JavaScript，WooCommerce为我们提供了一些JSEvents，方便我们在合适的时机添加自己的JavaScript事件。

结帐过程中的JSEvents

$(document.body).trigger('init_checkout');
$(document.body).trigger('payment_method_selected');
$(document.body).trigger('update_checkout');
$(document.body).trigger('updated_checkout');
$(document.body).trigger('checkout_error');
$(document.body).trigger('applied_coupon_in_checkout');
$(document.body).trigger('removed_coupon_in_checkout');

购物车页面中的JSEvents

$(document.body).trigger('wc_cart_emptied');
$(document.body).trigger('update_checkout');
$(document.body).trigger('updated_wc_div');
$(document.body).trigger('updated_cart_totals');
$(document.body).trigger('country_to_state_changed');
$(document.body).trigger('updated_shipping_method');
$(document.body).trigger('applied_coupon',[coupon_code]);
$(document.body).trigger('removed_coupon',[coupon]);

产品详情页中的JSEvents

$('.wc-tabs-wrapper,.woocommerce-tabs,#rating').trigger('init');

可变产品详情页中的JSEvents

$(document.body).trigger('found_variation',[variation]);

添加到购物车过程中的JSEvents

$(document.body).trigger('adding_to_cart',[$thisbutton,data]);
$(document.body).trigger('added_to_cart',[response.fragments,response.cart_hash,$thisbutton]);
$(document.body).trigger('removed_from_cart',[response.fragments,response.cart_hash,$thisbutton]);
$(document.body).trigger('wc_cart_button_updated',[$button]);
$(document.body).trigger('cart_page_refreshed');
$(document.body).trigger('cart_totals_refreshed');
$(document.body).trigger('wc_fragments_loaded');

怎么使用这些JSEvents

如果需要使用这些JSEvents插入我们的自定义动作，只需要在合适的target上面绑定WooCommerce提供的Events那么即可，如下：

jQuery('body').on('init_checkout',function(){
console.log('init_checkout triggered');
});

扫码添加UTHEME微信为好友

· 分享WordPress相关技术文章，主题上新与优惠动态早知道。
· 微信端最大WordPress社群，限时免费入群。