1

一部の製品バリアントの価格での比較を表示しようとしていますが、ゼロより大きいバリアントの価格での比較がある場合にのみ表示する方法がわかりません。0.00ドルの価格で比較を示しています。

javascriptを使用して価格を動的に更新しています。そのコードは次のとおりです。

<script type="text/javascript">
<!--
// mootools callback for multi variants dropdown selector
var selectCallback = function(variant, selector) {
if (variant && variant.available == true) {
// selected a valid variant
$('purchase').removeClass('disabled'); // remove unavailable class from add-to-cart button
$('purchase').disabled = false;           // reenable add-to-cart button
$('price-field').innerHTML = Shopify.formatMoney(variant.price, "{{shop.money_with_currency_format}}");  // update price field
$('compare-price').innerHTML = Shopify.formatMoney(variant.compare_at_price, "{{shop.money_with_currency_format}}");  // update compare at price
} else {
// variant doesn't exist
$('purchase').addClass('disabled');      // set add-to-cart button to unavailable class
$('purchase').disabled = true;              // disable add-to-cart button      
$('price-field').innerHTML = (variant) ? "Sold Out" : "Unavailable"; // update price-field message
}
};

// initialize multi selector for product
window.addEvent('domready', function() {
new Shopify.OptionSelectors("product-select", { product: {{ product | json }}, onVariantSelected: selectCallback }); 
});
-->
</script>

生のスクリプトがある場合、スクリプトは正常に機能します<div id="compare-price"></div>。各バリアントの価格での動的比較は、そのdivに追加されます。しかし、価格での比較がない場合でも、$0.00が追加されます。

バリアントの価格での比較がない場合、どうすればdivを非表示にできますか？私はこのようなことをしようとしています：

{% if product.variant.compare_at_price %}
    <div id="compare-price"></div>
{% endif %}

誰もがこれを行う方法を知っていますか？

4

2 に答える 2

1

わかりました、これは私が仕事に取り掛かったものです。最もエレガントなソリューションではないかもしれませんが、それは機能しています：

<script type="text/javascript">
<!--
// mootools callback for multi variants dropdown selector
var selectCallback = function(variant, selector) {
if (variant && variant.available == true) {
// selected a valid variant
$('purchase').removeClass('disabled'); // remove unavailable class from add-to-cart button
$('purchase').disabled = false;           // reenable add-to-cart button
$('price-field').innerHTML = Shopify.formatMoney(variant.price, "{{shop.money_with_currency_format}}");  // update price field
if(variant.compare_at_price > 0.0) {
$('compare-price').innerHTML = Shopify.formatMoney(variant.compare_at_price, "{{shop.money_with_currency_format}}");  // update compare at price
} else {
$('compare-price').innerHTML = "";
}
} else {
// variant doesn't exist
$('purchase').addClass('disabled');      // set add-to-cart button to unavailable class
$('purchase').disabled = true;              // disable add-to-cart button      
$('price-field').innerHTML = (variant) ? "Sold Out" : "Unavailable"; // update price-field message
}
};

// initialize multi selector for product
window.addEvent('domready', function() {
new Shopify.OptionSelectors("product-select", { product: {{ product | json }}, onVariantSelected: selectCallback }); 
});
-->
</script>
于 2012-08-22T14:16:38.747 に答える
0

コールバックで価格で比較をチェックしてみませんか？バリアントが渡されたので、価格を確認して適切に処理することができます。

if(variant.compare_at_price > 0.0) {
    $('compare-price').show().innerHTML = Shopify.formatMoney(variant.compare_at_price, "{{shop.money_with_currency_format}}");
} else {
    $('compare-price').hide();
}
于 2012-08-21T21:30:13.213 に答える