在Rails應用程序中的JS只加載第一次

Question

我在我的應用程序主頁上的一些鏈接上使用淡入淡出效果。這被一些JQuery的實現：

的JavaScript/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(); 
    }); 
}); 

當我火了應用程序的第一次這一切的偉大工程。但是，如果我離開主頁，當我回來時，淡出效果不再起作用，直到我「刷新」頁面。有任何想法嗎？

Answer 1

這可能是因爲Rails 4的新功能Turbolinks。 Turbolinks通過僅更新改變的頁面部分來減少來自客戶端的服務器請求。這意味着在加載新頁面時不會再次調用document.ready（或jQuery中的$(document).ready）。

One解決方案是隻刪除你的application.js在你的Gemfile的gem 'turbolinks'和require turbolinks，從而禁止turbolinks，而是一個更簡單的解決方法是隻在的application.js文件，其中包括補丁的一個turbolinks腳本添加require jquery.turbolinks通過在每個turbolinks調用中調用$(document).ready來解決問題。

有關更多信息，請參閱jQuery section in the turbolinks readme。