【发布时间】：2014-11-25 18:19:26
【问题描述】：
我最近将我的网站升级到 Bootstrap 3，并且正在检查所有布局以更新类名和各种功能以使其正常工作。我最近的问题是下拉菜单似乎不起作用。起初我以为我没有为导航栏正确实现代码，但在感到沮丧之后，我实际上尝试摆脱导航栏并直接使用BS 3 documentation 中的一个。即使那个代码也不起作用。我已经对此进行了调查，并且相当确定我已经加载了所有正确的 .js 库。这是我的 application.js：
//= require jquery
//= require bootstrap-sprockets
//= require jquery.ui.datepicker
//= require jquery.timepicker.js
//= require jquery_ujs
//= require turbolinks
//= require bootstrap
//= require jquery.remotipart
//= require chosen-jquery
//= require_tree .
这是我的<head> 中出现的内容：
<script data-turbolinks-track="true" src="/assets/jquery.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap/affix.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap/alert.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap/button.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap/carousel.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap/collapse.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap/dropdown.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap/tab.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap/transition.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap/scrollspy.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap/modal.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap/tooltip.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap/popover.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap-sprockets.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery.ui.core.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery.ui.datepicker.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery.timepicker.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery_ujs.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/turbolinks.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery.iframe-transport.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery.remotipart.js?body=1"></script>
我在同一页面上有弹出框和其他可折叠项目，并且一切正常，所以我相当确定所有 .js 都完好无损。
我在其他地方读到 turbolinks 会给 Bootstrap 3 带来问题，甚至尝试过（然后放弃并恢复）jquery.turbolinks gem 无济于事。不用说，我不知道如何在 jsfiddle 上重现这个（对不起）。
最后我验证了一下，每次点击下拉都会调用以下四个js函数，大概是这样的：
jquery.js:4306
eventHandle = elemData.handle = function( e ) {
// Discard the second event of a jQuery.event.trigger() and
// when an event is called after a page has unloaded
return typeof jQuery !== strundefined && (!e || jQuery.event.triggered !== e.type) ?
jQuery.event.dispatch.apply( eventHandle.elem, arguments ) :
undefined;
};
// Add elem as a property of the handle fn to prevent a memory leak with IE non-native events
eventHandle.elem = elem;
turbolinks.js:324
installClickHandlerLast = function(event) {
if (!event.defaultPrevented) {
document.removeEventListener('click', handleClick, false);
return document.addEventListener('click', handleClick, false);
}
};
tujquery.js:4306（再次）
turbolinks.js:324
handleClick = function(event) {
var link;
if (!event.defaultPrevented) {
link = extractLink(event);
if (link.nodeName === 'A' && !ignoreClick(event, link)) {
visit(link.href);
return event.preventDefault();
}
}
};
知道这里可能发生了什么以及如何解决吗？
【问题讨论】：
标签： jquery ruby-on-rails twitter-bootstrap twitter-bootstrap-3 turbolinks