jQuery Bootstrap滑塊不起作用

Question

相關代碼段如下-我在做什么錯？？？

這是我正在使用的寶石： https : //github.com/stationkeeping/bootstrap-slider-rails

APPLICATION.CSS

* = require_bootstrap-slider

的application.js

//
= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
= require underscore
= require gmaps/google
= require bootstrap-slider

INDEX.HTML.ERB

<script>$("#ex8").slider({
            tooltip: 'always'
        });
        </script>
        <input id="ex8" data-slider-id='ex1Slider' type="text" data-slider-min="0" data-slider-max="20" data-slider-step="1" data-slider-value="14"/>

樣式目錄

JS目錄

這就是我所看到的

控制台-錯誤

Answer 1

嘗試將application.js和CSS更新為

的application.js

//
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
//= require underscore
//= require gmaps/google
//= require bootstrap-slider

Application.css

*= require_bootstrap-slider

我個人的喜好是使用CDN

應用程序/視圖/布局/ application.html.erb

<%= stylesheet_link_tag '//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css' %>
<%= javascript_include_tag '//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js' %>