1

ここにコードがあります。

// HTML Code
<div class="article"></div>

// jQuery
$('.article').append('<a href="" class="toggle">Toggle div</a>');

新しく作成されたhrefリンクを使用して、次のようにdivを切り替えることは可能ですか？

// jQuery
$('.toggle').click(function() { 
   $('.article').toggle('slow');
});

私は運が悪かったので上記を試しました。インデックスページにリダイレクトされます。

4

1 に答える 1

3

使用しないclick()でください：非推奨であり、使用していなくても機能しません。使用on()：

$('.toggle').on('click', function() { 
   $('.article').toggle('slow');
});

また、aタグをに変更します<a href="javascript:void(0)" class="toggle">Toggle div</a>。

動作する理由とon()動作click()しない理由については、jQueryのドキュメントを読む必要があります。つまり、クリックイベントはページ上の要素にバインドされています。このスコープは、DOMに追加される将来の要素をカバーしていません。On()ただし、は委任されたイベントです。

委任されたイベントには、後でドキュメントに追加される子孫要素からのイベントを処理できるという利点があります。委任されたイベントハンドラーがアタッチされたときに存在することが保証されている要素を選択することにより、委任されたイベントを使用して、イベントハンドラーを頻繁にアタッチおよび削除する必要をなくすことができます。

于 2013-01-20T18:58:12.803 に答える