2009-08-25 4 views
1

この質問は、my last question about "too much recursion" errors in jQueryに似ていますが、ライブハンドラが関係しています。私は別の要素の中に一つの要素を持っている。どちらも同じ名前のカスタムイベントハンドラを持っています。外側の要素には従来のハンドラがあり、内側の要素にはライブハンドラがあります。外部要素でイベントをトリガーしようとすると、しばらくブラウザが一時停止し、「再帰が多すぎます」というエラーが表示されます。jQuery 1.3.2のライブハンドラで「再帰が多すぎます」エラー

私は、ハンドラ関数内でfalseを返すことによってライブハンドラのバブリングを防ぐことができることを読んだ。live handler documentation pageしかし、私はこれを試して、それは違いを生じさせるようではありません。いずれにしても、一度しかコールしようとしないと、何度も何度も外部関数が呼び出されるようです。

どうすればこの問題を解決できますか?このような名前のハンドラを持つことは可能でしょうか、別の名前を考えなければなりませんか?このコードを使用して問題をテストできます。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html><head> 
<title>live event handler test</title> 
</head> 
<body> 
<div id="outer"> 
    <div id="inner"> 
    </div> 
</div> 
<script type="text/javascript" src="jquery-1.3.2.min.js"></script> 
<script type="text/javascript"> 
$("#outer").bind("test", function() { 
    $("#inner").trigger("test"); 
}); 

$("#inner").live("test", function() { 
    return false; 
}); 

$(function() { 
    $("#outer").trigger("test"); 
}); 
</script> 
</body></html> 
+0

完璧なテストケース。 –

答えて

1

ルック:

$("#outer").bind("test", function() { 
    $("#inner").trigger("test"); 
}); 

あなたは#inner"test"をトリガーしているが、#inner#outerの子なので、イベントが#outerに 『バブルアップ』と、プロセス全体が繰り返さ(爆発するまで)。

編集:@Sethが指摘するように、あなたが#outer#innerの両方にlive()を使用する場合、それは動作します。その場合はevent.stopImmediatePropagation()のように"return false;"が機能するためです。同様に、両方でbind()を使用すると、それも機能します。その場合は、がevent.stopPropagation()のように機能するためです。

#outerliveの両方で、bindを使用している場合は、#innerで両方を混合しています。実際には、it is bound to the documentという理由で、liveハンドラを実行しない(つまり、return falseは実行されません)というイベントをトリガすると、スタックオーバーフローのためにイベントが決してdocumentにバブルすることはありません。

編集2

は、内イベントのバブリングを防止する方法はありますか? (live()?を使用)

いいえ。より良い説明をjquery Event.stopPropagation() seems not to workを参照してください。

+0

#innerのイベントはなぜ外に出るのですか?「偽りの返品」陳述がそれを防ぐと考えられるのではないか? –

+0

スタックオーバーフローが発生するのはなぜですか?ライブハンドラが実行されない場合、外部関数が何度も呼び出される理由はわかりません。 –

+0

@ mikez302: 'trigger'バブル。そのような単純な。 'live'を削除しても問題は残っています。 「生きている」とは関係ありません。私の最後の段落の文言は、私が思う問題を混乱させています。問題は、私が最初の段落で述べていることです。 –

0

カスタムイベントのライブとバインドの組み合わせにバグがありますか?実際に何が起こっているのかは不明です。あなただけのライブを使用する場合、それは動作します:

$("#outer").live("test", function() { 
    console.log("outer"); 
    $("#inner").trigger("test"); 
}); 

$("#inner").live("test", function() { 
    console.log("inner"); 
    return false; 
}); 

$(function() { 
    $("#outer").trigger("test"); 
}); 

はソースにあまりを掘っていないが、それはbindのように思えるが、関数の戻り値を無視します。 #outerのコールバックで

+0

本当ですか?私は "テスト"の名前を "クリック"に変更しようとしましたが、まったく同じエラーが発生しています。 –

+0

ええ、私は間違っていた。私の答えを更新しました。 – seth

関連する問題