[英]Jquery / Bootstrap “Uncaught TypeError” when using Carousel
我一直在尝试在我正在制作的此网站中实现一个简单的图像轮播。 现在这是一个非常基本的页面，这是我链接CSS和javascript的顺序
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
我了解首先链接jquery的重要性，这就是我所做的。 这就是我的轮播代码的外观。
<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block w-100" src="img/badminton.jpg" alt="Badminton">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="img/football1.jpg" alt="Football">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="img/pool.jpg" alt="Pool">
</div>
</div>
如您所见，我基本上已经从他们的网站复制了一个，只是为了使其正常工作。 我的第一个图像加载，但是尝试单击箭头指向下一个图像，出现以下错误
我在网上看过，对于哪个版本的bootstrap应该与哪个jquery似乎没有共识。 任何帮助，将不胜感激，谢谢。
我唯一推荐的更改是从幻灯片<divs>的类名称中删除“ carousel”一词，如下所示：
<div class="item active">
像这样：
<div class="item">
这是用于Bootstrap 3.3.7。 我还没有评论4.0。
您需要新版本的Bootstrap。尝试我的代码。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <link rel="stylesheet" type="text/css" href="css/style.css"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous"> <title>Document</title> </head> <body> <div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel"> <div class="carousel-inner"> <div class="carousel-item active"> <img class="d-block w-100" src="img/badminton.jpg" alt="Badminton"> </div> <div class="carousel-item"> <img class="d-block w-100" src="img/football1.jpg" alt="Football"> </div> <div class="carousel-item"> <img class="d-block w-100" src="img/pool.jpg" alt="Pool"> </div> </div> <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" crossorigin="anonymous"></script> </body> </html> </body> </html> [with no error][1]
未捕获的TypeError：undefined不是函数-使用Owl Carousel
[英]Uncaught TypeError: undefined is not a function - Using Owl Carousel
Bootstrap Carousel：未捕获的类型错误：无法读取未定义的属性“offsetWidth”
[英]Bootstrap Carousel: Uncaught TypeError: Cannot read property 'offsetWidth' of undefined
未捕获的TypeError：在Magento中使用jQuery插件时，undefined不是一个函数
[英]Uncaught TypeError: undefined is not a function when using a jQuery plugin in Magento
使用fadeIn（）时，jQuery“Uncaught TypeError：undefined不是函数”;
[英]jQuery “Uncaught TypeError: undefined is not a function” when using fadeIn();
NPM 引导轮播未捕获类型错误：超级表达式必须是 null 或 function 引导
[英]NPM Bootstrap Carousel Uncaught TypeError: Super expression must either be null or a function bootstrap
“Uncaught TypeError：无法读取属性'apply'of undefined”使用Bootstrap-Switch Jquery
[英]“Uncaught TypeError: Cannot read property 'apply' of undefined” Using Bootstrap-Switch Jquery
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.