0

私のアプリには、必要なすべての JS ファイル (私のスクリプト、Twitter Bootstrap などのライブラリ) が含まれています。

問題は、AJAX 経由で呼び出されるリクエストがある場合、呼び出し先のページに、アプリに含まれる JS ファイルが含まれず、呼び出し先のページに含める必要があることです。

例: my_scripts.jsには多くの JS 関数が含まれています。

AJAX を介して呼び出されるページへのリンク

<a href="/articles/create_new" data-remote="true>Create New Article</a>

/views/articles/_create_new.html.haml

...some content of this file.. #here doesn't work the functions from the file "my_scripts.js"

/views/articles/_create_new.html.hamlにこのリンクを入れると

= javascript_include_tag "my_scripts"
...some content of this file..

/views/articles/_create_new.html.haml でこれらの JS 関数が機能します。

JSファイルを常にAJAXページに含めるのは良い方法ではないため、すべてのJSファイルをすべてのAJAXページに自動的に配置する方法がある場合は、お尋ねしたいと思います...

ありがとう

4

2 に答える 2

1

これは、次の 3 つの方法のいずれかで実現します。

jQuery

http://api.jquery.com/load/から:

スクリプトの実行 サフィックスのセレクター式のない URL を使用して .load() を呼び出すと、スクリプトが削除される前にコンテンツが .html() に渡されます。これにより、スクリプト ブロックが破棄される前に実行されます。ただし、セレクター式を URL に追加して .load() を呼び出すと、DOM が更新される前にスクリプトが削除されるため、スクリプトは実行されません。両方のケースの例を以下に示します。

ここで、ドキュメントの一部として #a に読み込まれた JavaScript はすべて正常に実行されます。

$('#a').load('article.html');

ただし、次の場合、#b に読み込まれるドキュメント内のスクリプト ブロックは取り除かれ、実行されません。

$('#b').load('article.html #target');

基本的に、Ajax リクエストによって返された HTML に JS 参照を追加すると、jQuery がそれらを実行します。

RequireJS またはsimular

そのまま HTML を返すのではなく、スクリプト参照の配列も含む JSON バンドルの一部として HTML を返します。

{
    html: '<p>stuff</p>',
    scriptRefs: [ 'js/one.js', 'js/two.js' ]
}

次に、RequireJS などを使用して scriptRefs 配列を反復処理します。

ベースページにコードを追加するだけ

正直なところ、私はこれを行う可能性が高くなります。

于 2012-04-22T21:23:12.180 に答える
1

RequireJSや$ cript などのスクリプト ローダーを使用します。

また、コンテンツとロードするスクリプトの 2 つをページに返信させます。これは、次のような JSON を使用するのが最適です。

{
    "content" : "content here",
    "scripts" : ["an","array","of","script","urls"]
}

次に、データが返されたら、コンテンツを解析してペイントし、その後、スクリプト ローダーを使用してスクリプトをロードします。実際には、独自のスクリプト ローダーを作成できます。<script>タグを動的に作成し、それを に入れ<head>、src

于 2012-04-22T21:23:39.147 に答える