0

HTMLファイルがあり、Railsスタイルで書き直す必要があります。レールガイドを読んでみましたが、役立つ情報が見つかりませんでした。これが私が持っているHTMLの一部です。

<!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 %>

代わりに頭の中に入れるべきですか？また、タグで何かする必要がありますか？ありがとう

4

2 に答える 2

0

どのようなエラーが発生していますか？エラーを見ないと、必然的に問題がどこから来たのかわかりません。

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-23T18:42:17.237 に答える
0

一般的な経験則では、ライブラリは（jQueryのように）先頭に配置する必要があります。たとえば、jQueryを使用する他のすべてのコードは、コードの下に配置する必要があります。この理由は、jQueryを使用してDOM要素として通信するすべてのものをドキュメント内で（つまり、jsコードの上に）レンダリングする必要があるためです。

私が通常行うことは、ページの最後にすべて、つまりすべてのスクリプトを追加することです。このように、HTTPからのリクエストは最初にJSをロードせず、次にHTMLをロードしないため、ページ自体のロード時間が短縮されます。

于 2012-11-23T18:39:55.067 に答える