JavaScript："$"不是函数错误

Question

我继承了Shopify网站上的这段代码。将其和一些相关代码移动到基于Dawn的新主题中。不要认为主题是问题所在，而是这段代码触发了"$"不是一个函数错误。下面是该代码的一个示例:

$('.section__choose-texture').on('click', '.content', function ( ){
var current = $(this);
$('.content').removeClass('active');
current.addClass('active');
$('#prodTextureItem').val(current.data('texture'));
$('#productTexture').text(current.find('h3').text());
$('.section__choose-coffee').show();
var header_height = $('.site-header').height(),
offset_top = $('.section__choose-coffee').offset().top,
res = offset_top - header_height;
$('html, body').animate({ scrollTop: res }, 'slow');
});

我添加了一个函数stepOne() {"到顶部，然后用}结束，然后调用函数，但Shopify的编辑说这是糟糕的代码。我想这是因为函数列在我的例子的第一行。

那么我怎样才能使这个函数正常工作呢?代码需要完全重写吗?或者我的想法是正确的吗?

Answer 1

要使用$语句，您必须添加jquery文件或对项目的引用。

<script src="jquery.js"></script>

或from jquery.com

<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>

Answer 2

$函数不是JavaScript内置的。

来自jQuery库。

在你的脚本之前添加这个script标签来导入它:

<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>