Javascript 在Shopify中的产品模板内编写jQuery

我正在尝试在Shopify中获取产品的变体id，并将其传递给jQuery。但我无法在（Sections/product template.liquid）中编写脚本。 浏览器给出错误“未捕获引用错误：未定义jQuery”

我在product template.liquid的末尾编写了这段代码

<script>
jQuery(function($)
{
    $current_variant_id = {{ product.selected_variant.id }};
    $interval = setInterval(function()
    {
       if( $( '.product-single__thumbnail-item.slick-slide.slick-active.is-active' ).length > 0 )
       {
           if( !($( '.product-single__thumbnail-item[data-variant="'+$current_variant_id+'"]' ).hasClass('is-active')) )
           {
               $( '.product-single__thumbnail-item.slick-slide.slick-active.is-active' ).removeClass('is-active');
               $( '.product-single__thumbnail-item[data-variant="'+$current_variant_id+'"]' ).addClass('is-active');
           }
           clearInterval( $interval );
       }
    },1);
});
</script>

jQuery（函数（$）
{
$current_variant_id={{product.selected_variant.id}；
$interval=setInterval（函数（）
{
如果（$（'.product-single_uu-thumbnail-item.slick slide.slick active.is active'）。长度>0）
{
if（！（$（'.product-single_uu缩略图-item[data variant=“'+$current_uvariant_id+”））.hasClass（'is-active'））
{
$（'.product-single_uu缩略图-item.slick slide.slick active.is active'）。removeClass（'is-active'）；
$（'.product-single_uu缩略图-item[data variant=“'+$current_variant_id+'”）.addClass（'is-active'）；
}
clearInterval（$interval）；
}
},1);
});

---

我做错了什么？任何指导都将不胜感激。谢谢

这个问题的简单答案是确保Javascript库已加载到theme.liquid中的head元素中。这确保您可以使用该库中的$variable。

您可能没有在商店网站上使用jQuery。最简单的方法是编辑您的

主题.liquid

，为每个页面包含jQuery。只需在

标记正确之前的下方放置一个

脚本

标记即可：

---

您加载脚本的顺序是什么？我正在.liquid文件中编写此脚本。这里的秩序重要吗？因为它在Wordpress中工作得很好！检查jQuery是否在脚本之前加载或在脚本之前添加。。。