tob*_*yte 10 jquery ruby-on-rails twitter-bootstrap turbolinks twitter-bootstrap-3
我最近将我的网站升级到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>
我在同一页面上有弹出窗口和其他可折叠项目,并且一切正常,所以我相当确定所有.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();
}
}
};
任何线索可能会发生在这里以及如何解决它？
She*_*yar 13
无需使用即可解决此问题jquery-turbolinks.你需要先了解为什么会这样.启用turbolinks并单击链接后,将page:change触发一个事件,并从新加载的html重新评估所有javascript.
这包括加载的bootstrap javascript代码application.js.当bootstrap的javascript重新加载时,它会中断.您可以通过data-turbolinks-eval=false在application.js <script>标记中使用来解决此问题.
对于再培训局:
<%= javascript_include_tag 'application', 'data-turbolinks-eval' => false %>
<%= javascript_include_tag params[:controller] %>
对于SLIM:
== javascript_include_tag 'application', 'data-turbolinks-eval': false
== javascript_include_tag params[:controller]