如何解决如何解决jquery错误
我在 codeply 中找到了以下代码。将其复制到visual studio。在片段上，代码看起来应该是这样，但在我的电脑上，我得到了这个 
script.js:1 Uncaught ReferenceError: $ is not defined at script.js:1 但是我安装了 jquery，所以我只是想知道为什么会发生错误。尝试使用其他链接以另一种方式安装 jquery，但错误并未消失。
$('.carousel[data-type="multi"] .item').each(function() {
var next = $(this).next();
if (!next.length) {
next = $(this).siblings(':first');
}
next.children(':first-child').clone().appendTo($(this));
for (var i = 0; i < 2; i++) {
next = next.next();
if (!next.length) {
next = $(this).siblings(':first');
}
next.children(':first-child').clone().appendTo($(this));
}
});.carousel-control { width: 4%; }
.carousel-control.left,.carousel-control.right {margin-left:15px;background-image:none;}
@media (max-width: 767px) {
.carousel-inner .active.left { left: -100%; }
.carousel-inner .next { left: 100%; }
.carousel-inner .prev { left: -100%; }
.active > div { display:none; }
.active > div:first-child { display:block; }
}
@media (min-width: 767px) and (max-width: 992px ) {
.carousel-inner .active.left { left: -50%; }
.carousel-inner .next { left: 50%; }
.carousel-inner .prev { left: -50%; }
.active > div { display:none; }
.active > div:first-child { display:block; }
.active > div:first-child + div { display:block; }
}
@media (min-width: 992px ) {
.carousel-inner .active.left { left: -25%; }
.carousel-inner .next { left: 25%; }
.carousel-inner .prev { left: -25%; }
}<!DOCTYPE html>
<html lang="en">
<head>
<Meta charset="UTF-8">
<Meta http-equiv="X-UA-Compatible" content="IE=edge">
<Meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Document</title>
<!-- <link rel="stylesheet" href="assets/css/styles.css" /> -->
<!-- <script src="assets/script.js"></script> -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<script src='Untitled-1.js'></script>
<link rel="stylesheet" href='Untitled-1.css'/>
</head>
<body>
<div class="col-md-12 text-center"><h3>Product Carousel</h3></div>
<div class="col-md-6 col-md-offset-3">
<div class="carousel slide" data-ride="carousel" data-type="multi" data-interval="3000" id="myCarousel">
<div class="carousel-inner">
<div class="item active">
<div class="col-md-3 col-sm-6 col-xs-12"><a href="#"><img src="http://placehold.it/500/e499e4/fff&text=1" class="img-responsive"></a></div>
</div>
<div class="item">
<div class="col-md-3 col-sm-6 col-xs-12"><a href="#"><img src="http://placehold.it/500/e477e4/fff&text=2" class="img-responsive"></a></div>
</div>
<div class="item">
<div class="col-md-3 col-sm-6 col-xs-12"><a href="#"><img src="http://placehold.it/500/eeeeee&text=3" class="img-responsive"></a></div>
</div>
<div class="item">
<div class="col-md-3 col-sm-6 col-xs-12"><a href="#"><img src="http://placehold.it/500/f4f4f4&text=4" class="img-responsive"></a></div>
</div>
</div>
<a class="left carousel-control" href="#myCarousel" data-slide="prev"><i class="glyphicon glyphicon-chevron-left"></i></a>
<a class="right carousel-control" href="#myCarousel" data-slide="next"><i class="glyphicon glyphicon-chevron-right"></i></a>
</div>
</div>
</body>
</html>解决方法
在您的代码片段中，您有一个对 script.js 的引用，但它被注释掉了。
<!-- <script src="assets/script.js"></script> -->
然而，这就是您发布的错误消息显示存在 ReferenceError 的地方。
如果您在实际测试代码中启用/取消注释 script.js，并且所有内容都按照您发布的顺序列出，那么这可能是您的问题。如果您在该 JavaScript 文件（即 script.js）中使用 jQuery，请将“script.js”脚本标签放在所有其他脚本标签（尤其是，至少是您的 jquery.min.js 标签）之下。>
在上面的代码片段中，您首先列出了它，如果它包含在 jQuery 之前（并且您尝试在 script.js 中使用 jQuery），那么在读取错误消息时还不会定义 $。
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
