將Javascript集成到Ruby on Rails中

我有一個html文件，我需要用Rails風格重寫它。我試圖閱讀導軌指南，但找不到有用的信息。這是我擁有的HTML的一部分。將Javascript集成到Ruby on Rails中

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 

<% content_for :head do -%> 
    <%= stylesheet_link_tag 'css.css' %> 

<% end %> 

<head> 
<title>index</title> 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<link rel="stylesheet" media="all" type="text/css" href="css/css.css" /> 
<script language="JavaScript" type="text/javascript" src="images/jquery-1.7.1.min.js"></script> 
<script language="JavaScript" type="text/javascript" src="images/jQuery.infiniteCarousel.js">   
</script> 
<script language="JavaScript" type="text/javascript" src="images/jQuery.tbSwitching.js"></script> 
<script language="JavaScript" type="text/javascript" src="images/myfocus-1.2.4.full.js"></script> 
<script language="JavaScript" type="text/javascript" src="images/mF_expo2010.js"></script> 
<link href="images/mF_expo2010.css" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
<center> 
<div id="top"> 
<div class="one"> 
    <div class="one1"> 
     <img src="images/ico1.png" width="225" height="58"/> 
    </div> 
    <div class="one2"> 
     <div class="one3"> 
       <div class="one4">Login/Sign up</div> 
       <div class="one4">Create an Account </div>  
       <div class="one5">shopping bag</div> 
     </div> 
    </div> 
    </div> 
</div> 
<div class="two"> 
<% content_for :below_body do -%> 
    <%= javascript_include_tag 'images/jquery-1.7.1.min.js' %> 
    <%= javascript_include_tag 'images/jQuery.infiniteCarousel.js' %> 
<%= javascript_include_tag 'images/jQuery.tbSwitching.js' %> 
<%= javascript_include_tag 'images/myfocus-1.2.4.full.js' %> 
    <%= javascript_include_tag 'images/mF_expo2010.js' %> 
<% end %> 

<script> 
$(function(){ 
    $("#top .two3").hover(function(){ 
    $("#top .two3").removeClass("on").next(".two4").removeClass("ac"); 
    $(this).addClass("on").next(".two4").addClass("ac");   
},function(){ 

}); 
}) 
</script> 
<script> 
$(function(){ 
    $("#top .two5 a").hover(function(){  
    $(this).addClass("on");  
},function(){ 
    $(this).removeClass("on"); 
    }); 
}) 
</script> 
...... 
</body> 
</html>

我試圖通過使用下面的代碼在body標籤中修改它，但似乎沒有工作。

<% content_for :below_body do -%> 
    <%= javascript_include_tag 'images/jquery-1.7.1.min.js' %> 
    <%= javascript_include_tag 'images/jQuery.infiniteCarousel.js' %> 
    <%= javascript_include_tag 'images/jQuery.tbSwitching.js' %> 
    <%= javascript_include_tag 'images/myfocus-1.2.4.full.js' %> 
    <%= javascript_include_tag 'images/mF_expo2010.js' %> 
<% end %>

我應該把它放在頭裏面嗎？我也應該做任何與標籤？謝謝

來源

2012-11-23 otchkcom

一般的經驗法則是庫應該進入頭部（如jQuery），所有其他使用jQuery的代碼應該在代碼下面。原因是，你想要作爲一個DOM元素與jQuery交談的所有內容都必須在文檔中呈現（即在你的js代碼之上）。

我通常會在頁面末尾附加所有內容，即所有腳本。通過這種方式，頁面本身的加載時間將減少，因爲來自HTTP的請求不首先加載JS，然後加載HTML。

來源

2012-11-23 18:39:55 toxicate20

你得到了什麼錯誤？沒有看到錯誤，我們無法知道問題來自何處。

你在保留你的JS文件在rails_root/app/assets/javascripts/images？這就是你上面所說的。

例如，<%= javascript_include_tag 'images/jquery-1.7.1.min.js' %>會創建此標記：<script type="text/javascript" src="/javascripts/images/jquery-1.7.1.min.js?1284139606"></script>，其中包含與構建文件的時間有關的時間戳。

如果您在生產模式而不是開發模式下運行服務器，這也可能是一個問題。在生產模式下，您需要預編譯您的資產：rake assets:precompile。

來源

2012-11-23 18:42:17 parkr

將Javascript集成到Ruby on Rails中

回答

相關問題