Недавно я обновил свой сайт до Bootstrap 3 и в процессе просмотра всех макетов обновил имена классов и различные функции для правильной работы. Моя последняя проблема заключается в том, что выпадающие файлы, похоже, не работают. Сначала я думал, что не правильно использовал код для своего навигационного бара, но после того, как я расстроился, я фактически попытался просто избавиться от своего навигационного бара и использовать тот, который прямо из Документация BS 3. Даже этот код не работает. Я изучил это, и я уверен, что у меня есть все необходимые библиотеки .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>
И у меня есть popovers и другие складные элементы на одной странице, и все работает отлично, поэтому я уверен, что все .js находятся в такте.
Я читал в другом месте, что turbolinks может создавать проблемы для Bootstrap 3, и даже попытался (а затем оставил и вернул обратно) jquery.turbolinks gem безрезультатно. Само собой разумеется, я понятия не имею, как воспроизвести это на jsfiddle (извините).
Наконец, я проверил, что следующие четыре функции js вызывается каждый раз, когда я нажимаю drop down, предположительно в следующем порядке:
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();
}
}
};
Есть ли какая-нибудь подсказка, что может происходить здесь и как ее исправить?
