[英]Shopify variant price change using setCallBack not working
我正在尝试在选择变体时更新产品价格。 到目前为止,我有以下内容; 但只是不能让它工作。
我已将此脚本添加到 theme.liquid
{{ 'option_selection.js' | shopify_asset_url | script_tag }}
我在 product-template.liquid 中有价格
<div class="product-price"><span id="price-field">{{ product.price | money }}</span></div>
<select
v-model="form.id"
name="id" id="variant-id"
class="minimal mt-2 mb-2 {% if hide_default_title %}hidden{% endif %}">
{% for variant in product.variants %}
{% if variant.available %}
<option
{% if variant == current_variant %}selected="selected"{% endif %}
{% unless variant.available %}disabled="disabled"{% endunless %}
data-inventory-quantity="{{ variant.inventory_quantity }}"
data-price="{{ variant.price | money | strip_html }}"
value="{{ variant.id }}"
class="js-variant-radio">{{ variant.title }}
</option>
{% endif %}
{% endfor %}
</select>
和这里的回调 function
<script>
// <![CDATA[
var selectCallback = function(variant, selector) {
if (variant) {
if (variant.available) {
// Selected a valid variant that is available.
$('#add').removeClass('disabled').removeAttr('disabled').val('Add to Cart').fadeTo(200,1);
} else {
// Variant is sold out.
$('#add').val('Sold Out').addClass('disabled').attr('disabled', 'disabled').fadeTo(200,0.5);
}
// Whether the variant is in stock or not, we can update the price and compare at price.
if ( variant.compare_at_price > variant.price ) {
$('#price-field').html('<span class="product-price on-sale">'+ Shopify.formatMoney(variant.price, "") +'</span>'+' <s class="product-compare-price">'+Shopify.formatMoney(variant.compare_at_price, "")+ '</s>');
} else {
$('#price-field').html('<span class="product-price">'+ Shopify.formatMoney(variant.price, "") + '</span>' );
}
} else {
// variant doesn't exist.
$('#add').val('Unavailable').addClass('disabled').attr('disabled', 'disabled').fadeTo(200,0.5);
}
}
// initialize multi selector for product
jQuery(function($) {
new Shopify.OptionSelectors("variant-id", { product: , onVariantSelected: selectCallback });
});
// ]]>
</script>
查看代码,当您尝试初始化 Shopify.OptionSelectors 时,您似乎只是缺少产品Shopify.OptionSelectors
new Shopify.OptionSelectors("variant-id", { product: , onVariantSelected: selectCallback });
尝试将产品 object 添加到此行,看看是否能解决问题。 更新后的行应如下所示:
new Shopify.OptionSelectors("variant-id", { product: {{ product | json }}, onVariantSelected: selectCallback });
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.