我们使用 Woocommerce 销售彩盒。大多数情况下选择可变产品选项。
我们添加了一个带有调色板的模式对话框,客户可以从中选择颜色。这是 woocommerce 的常见下拉列表。
问题是,当我将正确的 SlugValue 传递给下拉列表时(从调色板中选择它之后),下拉列表中的值是正确的,但是需要触发以发布价格的事件不起作用。
我已经尝试触发onchange
下拉事件,但什么也没发生。
谁能告诉我,需要触发哪个事件,以及如何触发?
任何帮助!
我们使用 Woocommerce 销售彩盒。大多数情况下选择可变产品选项。
我们添加了一个带有调色板的模式对话框,客户可以从中选择颜色。这是 woocommerce 的常见下拉列表。
问题是,当我将正确的 SlugValue 传递给下拉列表时(从调色板中选择它之后),下拉列表中的值是正确的,但是需要触发以发布价格的事件不起作用。
我已经尝试触发onchange
下拉事件,但什么也没发生。
谁能告诉我,需要触发哪个事件,以及如何触发?
任何帮助!
万一将来有人偶然发现:WooCommerce 在整个 add-to-cart-variation.js 中提供触发器,允许您连接到网站的更改事件。您可以在该文件中找到所有可用的文件,但在这种情况下可能最有帮助的文件可以这样使用
$( ".variations_form" ).on( "woocommerce_variation_select_change", function () {
// Fires whenever variation selects are changed
} );
$( ".single_variation_wrap" ).on( "show_variation", function ( event, variation ) {
// Fired when the user selects all the required dropdowns / attributes
// and a final variation is selected / shown
} );
您要挂钩的触发器是内部的第一个参数.on()
。以下是一些可以帮助您入门的内容:
woocommerce_variation_select_change
Fires when the select is changed.
show_variation
当它找到一个变体时被触发,并且实际上会将找到的变体对象传递给您,这样您就可以直接访问价格,而无需手动过滤选择。
您可以在这里筛选并找到其余部分。
此代码执行初始问题中要求的确切功能:
$('#WC_variation_drop_down_ID').trigger('change');
将“#WC_variation_drop_down_ID”更改为您使用 jQuery 更改的字段的实际 ID。
这是一个更完整的解决方案,包括设置字段以及触发 WooCommerce 变体选择(基于单选按钮字段类的数组):
var fields = ['.gchoice_4_11_0', '.gchoice_4_11_1', '.gchoice_4_4_0', '.gchoice_4_4_1'];
for ( var i = fields.length; i--; ) {
$('#gravity_form_wrapper_ID').on('click', fields[i], function() {
$('#WC_variation_drop_down_ID').val( $(this).children('input').val() ).trigger('change');
});
}
受这篇关于设置 WooCommerce Variation Fields的帖子启发的解决方案。
如果您想知道选择了哪个变体。
您可以查看文件:add-to-cart-variation.js
并发现此函数还为您提供了变化数据:
$( ".single_variation_wrap" ).on( "show_variation", function ( event, variation ) { }
如果您知道您的变体 ID(您可以通过在后端悬停您的变体或在选择您的变体时检查此对象来找到它),那么您可以执行以下操作:
$( ".single_variation_wrap" ).on( "show_variation", function ( event, variation ) {
if( variation.variation_id === your_variation_id ) {
// Do stuff when this variation has been selected
}
});
选择一个变化时,我需要显示一些其他信息,这对我有所帮助。这可能有点离题,但这是我在搜索时发现的讨论。
主要来自这个页面
如果有人像我一样来到这里寻找答案,我将对此进行澄清。
我们在实现更改功能时遇到了问题,因为我们需要知道选择的变体的价格,但是“woocommerce_variation_select_change”我们从之前的变体中得到了价格。
因此,如果您想在更改完成后获得变化的价格,您必须使用 'woocommerce_variation_has_changed' jQuery 函数。
例子:
jQuery('#select_attribute_of_variation').on('woocommerce_variation_has_changed', function(){
// do your magic here...
})