Bootstrap Carousel（如何加載JavaScript？）

Question

我試圖實施一個引導程序傳送帶。它不會因爲某種原因滑動...當我點擊箭頭滑動我的http://localhost:3000/去http://localhost:3000/#carousel-example-generic

我相信我缺少必要的JavaScript要求，但不確定如何包括它們。

他們去哪個文件？ application.js或application.css.scss或在我的views之一？

另外需要包含哪些代碼，它是否必須在頁面的特定位置？是bootstrap.js還是bootstrap-transition.js還有其他什麼？我真的迷失了。

這是我的旋轉木馬，我相信這是正確的：

<div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> 
    <!-- Indicators --> 
    <ol class="carousel-indicators"> 
    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li> 
    <li data-target="#carousel-example-generic" data-slide-to="1"></li> 
    <li data-target="#carousel-example-generic" data-slide-to="2"></li> 
    </ol> 

    <!-- Wrapper for slides --> 
    <div class="carousel-inner"> 

    <div class="item active"> 
     <%= link_to image_tag("closeup.jpg", alt: "image", class:'img-responsive') %> 
     <div class="carousel-caption"> 
     ... 
     </div> 
    </div> 

    <div class="item"> 
     <%= link_to image_tag("parksolar.jpg", alt: "image", class:'img-responsive') %> 
     <div class="carousel-caption"> 
     ... 
     </div> 
    </div> 

    <div class="item"> 
     <%= link_to image_tag("big1.jpg", alt: "image", class:'img-responsive') %> 
     <div class="carousel-caption"> 
     ... 
     </div> 
    </div> 

    </div> 

    <!-- Controls --> 
    <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev"> 
    <span class="glyphicon glyphicon-chevron-left"></span> 
    </a> 
    <a class="right carousel-control" href="#carousel-example-generic" data-slide="next"> 
    <span class="glyphicon glyphicon-chevron-right"></span> 
    </a> 
</div> 

這是我apllication.js

// This is a manifest file that'll be compiled into application.js, which will include all the files 
// listed below. 
// 
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts, 
// or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path. 
// 
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the 
// compiled file. 
// 
// Read Sprockets README (https://github.com/sstephenson/sprockets#sprockets-directives) for details 
// about supported directives. 
// 
// bootstrap.js 
// Loads all Bootstrap javascripts 
//= require bootstrap 
//= require jquery 
//= require jquery_ujs 
//= require turbolinks 
//= require_tree . 

這是我application.css.scss（請注意，我也有一個navbar，sass標記可能會影響我的傳送帶滑塊嗎？）

@import "bootstrap"; 

.navbar { 
    border-radius: 0px; 
    border-width: 0px; 
    font-size: 16px; 
    font-weight: bold; 
    color: #f0ad4e; 
    padding-left: 150px; 
    padding-right: 150px; 
    padding-top: 35px; 
    margin: 0px; 
    background:transparent; 
} 

.navbar-default .navbar-nav > li > a { 
    color: white; 
} 

.navbar-default .navbar-brand { 
    color: white; 
} 






/* 
* This is a manifest file that'll be compiled into application.css, which will include all the files 
* listed below. 
* 
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets, 
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path. 
* 
* You're free to add application-wide styles to this file and they'll appear at the top of the 
* compiled file, but it's generally better to create a new file per style scope. 
* 
* 
*= require_self 
*= require_tree . 
*/ 

使用檢查元素我發現這些錯誤：

它們意味着什麼？

Answer 1

我想和大家分享，我已經解決了很多的「不使用Javascript工作」的問題簡單地通過具有

//= require jquery 
//= require jquery_ujs 

上述

//= require bootstrap 

中的application.js文件

。

請試試這個，讓我知道它是否有幫助。 你可以在這裏分享你的GEM文件內容嗎？