非同期的に読み込まれたコンテンツの$（document）.ready相当のもの

多くのHTMLとJavaScriptを含むUI（ページ1）があります。

$("#myDialog").dialog({ modal: true /* Other options */ }); 
$('#myDialog').load('page2Link', { }, function() { }); 
$('#myDialog').dialog('open');

ページ2その後、HTMLとJavaScriptの束を持っている：1ページ上の要素のいくつかがクリックされたときは、jQueryのUIのダイアログが開かれ、部分的にページがロードされている（のがページ2がいることを呼びましょう）同じように。簡単な例：

<script src="Scripts/page2Stuff.js" type="text/javascript"></script> 

<div id="page2Body"> 
    <!-- More elements --> 
</div>

私は2ページが完全にレンダリングされるまで待つ必要があるpage2Stuff.js内部JSを持っています。新しいHTMLがDOMに追加されたかどうかを確認するために、この部分ページ内で使用できるものはありますか？私は以下を試しました：

$('#myDialog').load('page2Link', { }, page2ReadyFunction);

これはpage2ReadyFunctionを見つけることができません。 page2Stuff.jsで.loadのJavaScriptを実行して、それを破棄すると思いますか？

setTimeoutを使用し、$('#page2Body')が何かを返すかどうかを確認してくださいが、これは理想的とは思われません。

出典

2012-01-09 xbrady

page2ReadyFunctionは、ロードの完了時に呼び出されるコールバックハンドラです。それは行く最善の方法だろう、なぜそれが呼ばれていないのか分からない？ page2ReadyFunctionの実装/定義方法を説明できますか？ – c4urself

'page2'の最後に' script'を置くのはなぜですか？ –

@ c4urself page2ReadyFunctionはpage2Stuff.jsで次のように定義された関数にすぎません：function page2ReadyFunction（）{} – xbrady

、このように、すべてのHTMLの後に、それの最後にそれを置く：

<div id="page2Body"> 
    <!-- More elements --> 
</div> 

<script src="Scripts/page2Stuff.js" type="text/javascript"></script>

コードが応じて実行されますので、スクリプトを実行するまでにHTMLが準備されていることを確実にすることができます。これはPAGE2の身体の上に行くだろう

<body onload="function2kickOffP2()">

：

出典

2012-01-09 19:11:41

ありがとうございます。それだけで十分です。 – xbrady

load関数を実行すると、正確な時刻にpage2ReadyFunctionが存在することが予想されます。あなたがスクリプトをロードしていないからではありません。以下は、その問題を回避するだろうが、または仕事スクリプトが非同期でロードするべきではありませんので：

$('#myDialog').load('page2Link', { }, function() { 
    function tryPageLoad() { 
     if(page2ReadyFunction) 
      page2ReadyFunction(); 
     else 
      setTimeout(tryPageLoad, 100); 
    } 
    tryPageLoad(); 
});

この：

$('#myDialog').load('page2Link', { }, function() {page2ReadyFunction();});

は、あなたがこのような何かを行うことができ、その問題を回避するには関数は100msごとにpage2ReadyFunctionが存在するかどうかを調べて、それが呼び出されたときに呼び出す。

もちろん、子スクリプトタグが非同期に読み込まれ、JavaScriptが実行される前にレンダリングが行われるため、心配する必要はありません。 console.logを使用すると、最初に何が起きたのか、クライアントスクリプト内のJavaScript、またはコールバック関数を確認することができます。 jQueryのドキュメントからロードするため

出典

2012-01-09 19:01:05

コールバック関数：http://api.jquery.com/load/

完了（responseText、textStatus、XMLHttpRequestの）要求が完了したときに実行されるコールバック関数。

この関数は、要求が完了したときに実行されますが、page2がレンダリングされるまで待つ必要があります。

簡単な解決策は、page2がプルするjavascriptファイルに$（document）.ready（）ブロックを入れることです。

出典

2012-01-09 19:01:16 jbabey

ページの要素がページ1の文書に読み込まれているため、これは機能しません。ドキュメントが既に準備されているので、page2の$（document）.ready（）はすぐに実行されます。右？ – xbrady

してくださいあなたは、完全なAjaxの負荷

後にロードするために何かをしたい場合は、その

var req= $.ajax({ 
      url:'page2Link', 
      type:"post", 
      data:{ajax:1,field_id:field_ids,whatever:whatever} 

     }); 
     //after loading 
     req.complete(function(res){ 
      $('#myDialog').html(res); 
     }); 
     //after complete loading and request end 
     req.always(function(res){ 
      page2ReadyFunction 
     });

すべてその代わりに

$('#myDialog').load('page2Link', { }, function() { });

出典

2012-01-09 19:02:13

よう

フルAjaxの機能を使用して得ましたページ2のようにしてください：

代わりに、あなたの2ページ目の先頭にあなたの scriptタグを持つ

<script src="Scripts/page2Stuff.js" type="text/javascript"></script> 

<div id="page2Body"> 
    <!-- More elements --> 
</div> 

<script> 
$(function() { 
    // call your function from page2Stuff.js here 
}); 
</script>

出典

2012-01-09 19:09:59 techfoobar

あなたはこのようなものを使用することができます。

出典

2012-01-09 19:12:35 webdad3

非同期的に読み込まれたコンテンツの$（document）.ready相当のもの

答えて

関連する問題