2012-01-05 4 views
4

私は完全にajaxで駆動されるウェブサイトを持っていますので、最近私は委任技術を研究しなければなりませんでした。私は、.liveと.delegateが廃止され、使用する新しい機能が.onであることを知りました。jQueryの.on関数が 'load'イベントを好きではないようです。

私は動的にそうように、現在のページ(AJAX)に分裂にWebページをロードしていた場合:私は、上のクリックできるtest.phpをは

<html> 
    <head> 
    </head> 
    <body> 
    <div id="map">THIS IS THE MAP</div> 
    </body> 
</html> 

のように見えます

<html> 
<head> 
<script src="jquery.js"> 
</script> 
<script> 
function ajaxTest() 
{ 
    $('#content').load('test.php'); 
} 
</script> 
<script type="text/javascript"> 
$(function(){ 
    $(document).on("click", "#map", function(){ 
     alert("it has been loaded"); 
    }); 
}); 
</script> 
</head> 
<body> 
    <div id="content"> 
     <button onClick="ajaxTest()" value="Click Me"> 
      This is to be clicked 
     </button> 
    </div> 
</body> 
</html> 

「これは地図です」という言葉が実際に警告を表示します。私はの線に沿ってもっと何か必要

$(document).on("**click**", "#map", function(){ 

を:それは明らかに動作しません

$(document).on("**load**", "#map", function(){ 

を、そう似たような場合、私は思ったんだけど、私が持ってきた問題があるの代わりにやっておそらく。私がこのことについても調べているのは、地図の部分に「これは地図」だけではなく、Googleマップやswfオブジェクトなどがあるためです。どんな助けもありがとう。あなたはあまりにも参考になること、まだ存在しない部門へのGoogleマップをロードする方法を答えるしたい場合

;)

+0

のようなものがあなたをしました.bind( "click"、 "testfunc");を試してください。 –

答えて

5

のみいくつかのイベントがバブルアップ親チェーンをして上使用することができます親オブジェクトは.on()または.live()または.delegate()です。​​は、泡立つイベントの1つではありません。

これは、jQueryドキュメントからバブルするイベントの一部です。クリック、dblclick、keydown、keypress、keyup、mousedown、mousemove、mouseout、mouseover、およびmouseup。 doc page for .on()から

は、ここに引用です:

すべてのブラウザでは、loadイベントはバブルしません。あなたの特定の例では

、あなたはこのようなオブジェクトに直接イベントをバインドすることはできません:あなたはこのようなオブジェクトに直接結合すると、

$("#map").on("load", function(){}); 

または

$("#map").load(function(){}); 

何のバブリングをロードイベントで動作します。オブジェクト#mapは、イベントハンドラをバインドするときに存在する必要があります。これは、.on()または​​を使用するこの方法では、将来作成されるオブジェクトでは使用できません。イベントハンドラは、オブジェクトの作成後にオブジェクトにアタッチする必要があります。

+0

オブジェクトがまだ作成されていない場合は、どのコードを使用できますか? (私はこれが質問だったと思う)。 – lijn

+0

@lijn - 私の答えとして、 'load'イベントは親にバブルアップしないので、ターゲットオブジェクトが存在する前に何かにバインドすることはできません。そのオブジェクトが作成された後、実際のオブジェクトにバインドする必要があります。 – jfriend00

+0

thx!だから、それは不可能だと思われる – lijn

1

あなたはresponseがあなたの代わりに結合二つの別々のスクリプトやイベントでそれを行うの負荷で使用callbackfunctionを作ることができるloadedときに何かをしたい場合は、

$('#content').load('test.php', function(){ 
alert("map is loaoded.") 
}); 

reference

関連する問題