0

jQuery イベント ハンドラーで予期しない動作が発生しています。これは、この質問で説明されている問題と非常によく似ています:複数の要素にアタッチすると、jQuery イベント ハンドラーが失敗するのはなぜですか? .

基本的に、簡単な例は、私のページの呼び出しです

   $(document).ready(function(){
        $('a.submit').click(function(e){
              e.preventDefault();
              alert(this.href);
        });
   });

マークアップが次のとおりであると仮定します。

<html>
    <body>
        <a href="url1" class="submit">text1</a>
        <a href="url2" class="submit">text2</a>
        <a href="url3" class="submit">text3</a>
    </body>
</html>

最後のリンクを除く送信クラスのすべてのリンクで、イベントが発生します。ページ上の最後のリンクは.submit、イベント ハンドラーに接続されません。click(fn)作品と交換live('click',fn)。

私の問題は、元のハンドラーが失敗する理由がわからないことです。すべてのリンクが同時にレンダリングされ、ハンドラー サブスクリプションを でラップしています。$(document).ready()これにより、DOM が確実に読み込まれる はずです。

ハンドラーが縮小された JavaScript ファイルの奥深くに登録されているというより複雑な状況があるため、これを理解する必要があるため、このバグが発生したときに修正するのではなく、このバグを防止する方法を理解できれば非常に役立ちます。

もう 1 つ注意すべき点は、Firefox、Chrome、および IE で同じ奇妙な動作が発生していることです。jQuery1.5.1を使用しています

4

1 に答える 1

0

あなたが提供したhtmlを考慮して：

<a href="url1" class="submit">text1</a>
<a href="url2" class="submit">text2</a>
<a href="url3" class="submit">text3</a>

およびJavaScript：

$(document).ready(function(){
        $('a.submit').click(function(e){
              e.preventDefault();
              alert(this.href);
        });
   });

それは機能する必要があります。間違いなし。ただし、アンカータグ<a>が動的に作成されている場合は、ダイレクトクリックイベントをそれらにバインドすることはできませんが、

$('a.submit').on('click', function(e){
    //magic here
});
于 2011-04-17T18:01:25.067 に答える