1

私はRubyonRailsに飛び込み、Rails3.2.8を使用するアプリを構築しています。私はまだアセットパイプラインの使い方を学んでいますが、すでに問題に直面しています。私のWebサイトのさまざまなページ（つまり、home.html-> home.js、parts.html-> Parts.js）でJavascriptファイルを整理して名前を付けていますが、RailsアプリはすべてのJavascriptファイルと1つのロードされたページ（home.html）に存在しない要素を参照しているため、Javascriptファイルがクラッシュしています...

"uncaught exception: jsobj.edit can't find div #parts_list"

オンラインドキュメントに従って、アプリで必要なすべてのJSファイルをマニフェストに含めています...

//= require modernizr-latest
//= require jquery
//= require jquery_ujs
//= require home
//= require parts
//= require_tree .

...したがって、ホームページをロードすると、parts_list divがホームページに存在しないため、parts.jsファイルがロードされて実行され、クラッシュします。

私の質問は...

  1. この問題にJavascriptレベルで対処する必要がありますか？もしそうなら、どのように？
  2. または、Railsレベルで修正を試み、常に実行する必要のあるJavascriptファイルのみを含める必要があります。繰り返しますが、もしそうなら、どうすればこれにアプローチできますか？
  3. これはかなり一般的な問題のようです。Railsを正しく使用していませんか？

よろしくお願いします！

4

3 に答える 3

4

特定のJavaScriptファイルを特定のビューページにのみ含めるには、次の手順を実行する必要があります。

i）アセットフォルダに別のフォルダを作成します。'separate_view'、および内部に特定のjsファイルとcssファイルを配置します。

ii）アプリケーションのレイアウトで、「separate_view」を次のように記述します。
  <％=利回り：separate_view％>

iii）ターゲットテンプレートで、「separate_view」に次のように記述します。
  <％content_for（：separate_view）do％>
    <％= javascript_include_tag "xxx.js"％>
    <％= stylesheet_link_tag "xxx.css"％>
  <％end％>


上記は、特定のビューファイルでうまくいきます。

于 2012-12-01T05:52:04.750 に答える
1

あなたの質問に答えるには：

  1. この方法で行うこともできますが、必ずしも必要というわけではありません。アセットをビューごとに読み込むことができるため、必要なときにだけアセットを読み込むことができます。重要なのは、そこにあるマニフェストファイルと、それがいつロードされるかを理解することです。
  2. はい、これを行います。RailsCastsエピソード＃279は、アセットのロードについて説明しています。また、アセットを分離して、必要なときにのみロードする方法についても触れています。短いバージョンでは、マニフェストファイルがに読み込まれるlayoutため、サイトのセクションごとに異なるレイアウトを使用すると、どのアセットをどのビューに読み込むかをかなり簡単に制御できます。
  3. Railsを正しく使用していますが、AssetPipelineの学習は一般的であり、多くの人にとっては急な学習曲線になることもあります。そのRailscastのエピソードと多くの練習は、私の最高の推奨事項です。
于 2012-12-01T03:16:07.733 に答える
0

  1. はい。スクリプトのロード時に存在するDOM要素に依存しないことで、これを解決する必要があります。通常、スクリプトはページの上部で宣言されるため、いずれかのDOM要素がブラウザによってレンダリングされる前にスクリプトが読み込まれます。スクリプトの実行時にDOMが存在することに依存している場合は、問題が発生する可能性があります。代わりに、問題の機能をメソッド/関数にラップし、 $（document）.readyでこの関数を実行するか、 live（）イベントをバインドすることで、これを修正する必要があります。

  2. はい。複数のマニフェストファイルを作成することでこれを修正できます（デフォルトで含まれている1つの巨大なapplication.jsの代わりに）

  3. この問題は通常、（1）と（2）の組み合わせによって解決されます。

于 2012-12-01T03:17:21.090 に答える