[英]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.