2016-06-10 153 views
0

我寫了一些jQuery來定位左側導航欄中的列表項目(li)。當我將更改推送到Heroku時,jQuery工作正常,但我寫的jQuery在本地主機上不起作用。我瞄準的效果是,當用戶將鼠標移動到導航欄中的鏈接上時,鏈接移動到右側2時。我無法弄清楚爲什麼jQuery在託管網站上運行而不是本地主機。我有一種感覺,它可能與application.js文件有關。任何幫助將不勝感激,並提前致謝!jQuery適用於Heroku,但不適用於Rails本地主機

// javascript assets 
// = require jquery 
// = require jquery_ujs 
// = require turbolinks 
// = require welcome.js 
// = require_tree . 

// the html 
<div class="list-items"> 
     <ul> 
     <li class="links"><%= link_to "Portfolio", portfolio_url %></li> 
     <li class="links"><%= link_to "Tutorials", tutorials_url %></li> 
     <li class="links"><%= link_to "Blog", blog_url %></li> 
     <li class="links"><%= link_to "About Me", aboutme_url %></li> 
     </ul> 
</div> 

// css for list items 
.list-items { 
    font-size: 1.5em; 
    line-height: 2em; 
    margin-left: -.20em; 
} 


// JS for hovering over the link 
$(document).ready(function() { 
    console.log("You are in the console right now!!"); 

    $(".links").on("mouseenter", function() { 
    $(this).css("margin-left", "2em"); 
    }); 

    $(".links").on("mouseleave", function() { 
    $(this).css("margin-left", "-0.05em"); 
    }); 
}); 
+0

當您嘗試在本地主機上運行時,您面臨的錯誤是什麼? – Nirupa

+0

@Nirupa當我在本地主機上運行它時,我不會收到任何錯誤。一切正常,除了JavaScript。 –

回答

0

有自帶這裏想起一件事......

TurboLinks不

$(document).ready(function() {

很好的工作,因爲當你瀏覽,Turbolinks不重新加載頁面。在您的本地機器上,您可能看不到它僅僅是因爲Turbolinks加載頁面的方式。在製作過程中,您可能導航方式不同,頁面實際上已經解除了此事件。

查看Rails 4: how to use $(document).ready() with turbo-links的一些細節。

+0

我以前使用過$(document).ready()和Rails,所以我從來沒有遇到任何問題。我已經使用jQuery已經有一段時間了,所以我忘記了如何讓它和Rails一起玩。 –

相關問題