WooCommerce变体选项卡管理脚本

Question

我将多个woocommerce_wp_select和div(信息(添加到woocommerce_variable_product_before_variations操作挂钩(管理产品的变体选项卡(。

几个信息div根据带有自定义JavaScript的select的值显示。

当我编辑变体产品时，当更改选择的值时，它可以正常工作。

但是当创建一个全新的变体产品时，我的Javascript就不起作用了。我认为它不绑定javascript事件。我尝试过woocommerce_variations_loaded事件，在ajaxComplete之后，结果相同。

这是我的自定义JavaScript:

jQuery(document).ready(function($) {
wc_vs_product_options_type = $( '#wc_vs_product_options_type' );

var wv_vs_init_js = function() {
if (wc_vs_product_options_type.val() !== 'nothing') {
$('.wc_vs_product_options_settings').removeClass('hide');
}
$('#wc_vs_notice_' + wc_vs_product_options_type.val()).removeClass( 'hide' );
}

var wv_vs_on_change_js = function() {
wc_vs_product_options_type.on( 'change', () => {
$( '.wc_vs_notices' ).addClass( 'hide' );
$( '#wc_vs_notice_' + wc_vs_product_options_type.val() ).removeClass( 'hide' );
if ( wc_vs_product_options_type.val() !== 'nothing' ) {
$( '.wc_vs_product_options_settings' ).removeClass( 'hide' );
} else {
$( '.wc_vs_product_options_settings' ).addClass( 'hide' );
}
});
} 
$(document).on('woocommerce_variations_loaded', function() {
$(document).ajaxComplete( () => {
wv_vs_init_js();
wv_vs_on_change_js();
});
});
});

在wooccommerce在ajax上创建变体之后，什么是正确的事件？

Answer 1

WooCommerce有两个在后台添加/加载的变体事件：woocommerce_variations_added和woocommerce_variations_loaded

我已经用这个JS代码解决了我的问题：

jQuery(document).ready(function($) {

function wv_vs_admin(wc_vs_type) {
if (wc_vs_type.val() !== 'nothing') {
$('.wc_vs_product_options_settings').removeClass('hide');
}
$('#wc_vs_notice_' + wc_vs_type.val()).removeClass( 'hide' );
wc_vs_type.on( 'change', () => {
$( '.wc_vs_notices' ).addClass( 'hide' );
$( '#wc_vs_notice_' + wc_vs_type.val() ).removeClass( 'hide' );
if ( wc_vs_type.val() !== 'nothing' ) {
$( '.wc_vs_product_options_settings' ).removeClass( 'hide' );
} else {
$( '.wc_vs_product_options_settings' ).addClass( 'hide' );
}
});
}

$('#woocommerce-product-data').on('woocommerce_variations_loaded', () => {
$(document).ajaxComplete( () => {
wv_vs_admin( $( '#wc_vs_product_options_type' ) );
});
});
});