我的 Bootstrap Carousel 没有前进，也没有自动运行答案

【问题标题】：My Bootstrap Carousel is not advancing, nor running automatically我的 Bootstrap Carousel 没有前进，也没有自动运行
【发布时间】：2015-10-24 23:25:01
【问题描述】：

我的 Bootstrap Carousel 无法正常工作，我搜索了其他 Bootstrap carousel 线程，但似乎找不到答案。通常，这里大多数问题的答案是 jQuery 库要么没有正确链接，要么根本没有链接，而我认为我的是。

这是我的代码：

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
 <link type="text/css" rel="stylesheet" href="main.css">
</head>
<body>
<header>
<nav class ="navbar navbar-default" role = "navigation">
    <div class= "container">
        <div class = "navbar-header">
            <a class = "navbar-brand" href="#featured"> <span class="subhead">Wisdom Pet Medicine</span></a>
        </div>
        <ul class = "nav navbar-nav navbar-right">
            <li><a href="#featured">Home</a></li>
            <li><a href="#mission">Mission</a></li>
            <li><a href="#services">Services</a></li>
            <li><a href="#staff">Staff</a></li>
            <li><a href="#testimonials">Testimonials</a></li>
        </ul>     
    </div> 
</nav> <!--main nav-->

<div class= "carousel slide" data-ride= "carousel" id = "featured">
    <div class="carousel-inner">
        <div class="item active"><img src= "img/carousel-lifestyle.jpg" alt="lifestyle"></img></div>
        <div class="item"><img src= "img/carousel-exoticanimals.jpg" alt="animals"></img></div>
        <div class="item"><img src= "img/carousel-fish.jpg" alt="fish"></img></div>
        <div class="item"><img src= "img/carousel-mission.jpg" alt="mission"></img></div>
        <div class="item"><img src= "img/carousel-stateoftheart.jpg" alt="motto"></img></div>
        <div class="item"><img src= "img/carousel-vaccinations.jpg" alt="vaccine"></img></div>
    </div> <!-- Wrapper for slides -->
    <a class ="left carousel-control" href= "#featured" role = "button" data-slide ="prev"><span class= "glyphicon glyphicon-chevron-left"></span></a>
    <a class ="right carousel-control" href= "#featured" role = "button" data-slide ="next"><span class= "glyphicon glyphicon-chevron-right"></span></a>
</div> 
</div><!-- carousel-->
</div>
    </header>
    <script src ="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>   
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js" integrity="sha512-K1qjQ+NcF2TYO/eI3M6v8EiNYZfA95pQumfvcVrTHtwQVDG+aHRqLi/ETn2uB+1JqwYqVG3LIvdm9lj6imS/pQ==" crossorigin="anonymous"></script>
    </body>
    </html>

我也有一些 CSS，可能不相关，但无论如何我都会包含它：

body {
    font-size: 1.5em;
    font-weight:200;

}
.navbar {
    border-radius: none;
}

.navbar-nav {
    padding-right: 20px; 
}

.navbar-header>a {
    font-size:1.2em;
    font-weight:150;
    color: black !important;
}


.navbar-nav>li>a:hover, .navbar-nav>li>a:focus {
    transition: all 0.5s ease 0s;
    color: green !important;

}

.carousel {
    position:relative;
    top:-20px;
}

【问题讨论】：

如果打开开发工具，控制台会报错吗？

标签： html css twitter-bootstrap carousel

【解决方案1】：

您需要使用不同版本的 jQuery（您使用的是 v1.8.3），最低版本为 v1.9.1。

如果使用 CDN，我建议查看其中之一。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

或

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>

或

CDNjs

【讨论】：

这解决了！非常感谢！这让我发疯了！
没问题，很高兴能帮上忙！