检查 JS 远程替换中的变体可用性，Shopify

编程问答 2022-04-23

问题描述

我被要求自定义一个 Shopify 网站，但我在使用 Variants Dropdown 时遇到了问题，因为有一个简短的 JS 代码片段替换了主要的 Select 元素。

此代码段不检查变体可用性，我不知道 JS 所以想知道是否有人有解决方案？

我尝试在 JS 代码中使用 IF 语句来实现结果，但由于某种原因它破坏了页面的标题并且不显示变体数量。

如前所述，我不懂 JS，所以希望这是一个相当直接的东西。

提前致谢。

这是指向存在此问题的页面的链接。 https://perfumesonline.ie/products/3614223162963?variant=31708294938676

下面是JS代码

// RENDER SIZE OPTION
var renderSizeOptions = function(options){
    var sizeOptionIndex = $('.size_product__options .size_toggle').data('option-index');
    var sizeSelect = $('#shopify-section-' + sectionID + ' .single-option-selector').eq(sizeOptionIndex);
    var selectId = '#' + sizeSelect.attr('id');
    var container = $('#shopify-section-' + sectionID + ' .size_product__options .size_toggle');
    var content = '<label>' + options[sizeOptionIndex] + ':</label>';

    
    $( selectId + ' option' ).each(function(){
        var value = $(this).val();
        sizeSelect.parent('.selector-wrapper').addClass('hidden');
        if ( sizeSelect.val() == value ) {
            return content = content + '<div class="size_item current" data-val="' + value + '"><span class="size_inner">' + value + '</span></div>';
        } else {
            return content = content + '<div class="size_item" data-val="' + value + '"><span class="size_inner">' + value + '</span></div>';
        };
    } );

    container.html(content);

    $('.size_product__options .size_item').on('click',function(e){
        sizeSelect.val( $(this).data('val') ).trigger('change');
    });

};

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

javascriptshopifyshopifyvariantvariant