Rails App 中的 JS 只加载第一次

【问题标题】：JS in Rails App only loads the first timeRails App 中的 JS 只加载第一次
【发布时间】：2013-09-01 11:59:10
【问题描述】：

我在我的应用程序主页上的某些链接上使用了淡入淡出效果。这是由一些 JQuery 完成的：

javascripts/pages.js

$(document).ready(function() {
    $('.home_tile_text').hide().removeClass('text').addClass('text-js');
    $('.home_tile_overlay').hide().removeClass('overlay').addClass('overlay-js');

    $('.home_tile').mouseenter(function(){
        $(this).find('.text-js').finish().hide().fadeIn();
         $(this).find('.overlay-js').finish().hide().fadeIn();
    });
    $('.home_tile').mouseleave(function(){
        $(this).find('.text-js').finish().show().fadeOut();
         $(this).find('.overlay-js').finish().show().fadeOut();
    });
});

当我第一次启动应用程序时，这一切都很好。但是，如果我离开主页，当我返回时，淡出效果将不再起作用，直到我“刷新”页面。有什么想法吗？

【问题讨论】：

标签： javascript jquery ruby-on-rails

【解决方案1】：

这可能是因为 Rails 4 的新功能Turbolinks。 Turbolinks 通过仅更新页面中发生变化的部分来减少来自客户端的服务器请求。这意味着在加载新页面时不会再次调用 document.ready（或 jQuery 中的 $(document).ready）。

一种解决方案是只删除 gemfile 中的 gem 'turbolinks' 和 application.js 中的 require turbolinks，从而禁用 turbolinks，但更简单的解决方法是在 application.js 文件中添加 require jquery.turbolinks，其中包括通过在每次 turbolinks 调用时调用 $(document).ready 来修补问题的 turbolinks 脚本。

更多信息请参考jQuery section in the turbolinks readme。

【讨论】：

工作就像一个魅力。谢谢！