jQuery で動的に追加された要素でクリック イベントが起動できないのはなぜですか?

jQuery で動的に追加された要素にクリック イベントをバインドする

jQuery を使用して HTML 要素を動的に追加する場合、クリック イベントをそれらの要素にバインドすることが重要ですインタラクティブにするためです。ただし、特にイベントが実行されていない場合、これによって問題が発生することがあります。

提供されたコードでは、.add_to_this 要素に動的に追加されるリンク (close_link) に onclick イベントをバインドしています。 。ただし、リンクをクリックしてもイベントは発生しません。

問題は、bind() などの非推奨のイベント バインディング メソッドの使用にあります。これらのメソッドは、jQuery の最新バージョンでは on() メソッドに置き換えられました。

クリック イベントを動的に追加された要素に正しくバインドするには、次の構文を使用します。

$(document).on('click', '.your-selector', function() {
  // Function to execute on click
});

Inこの場合、バインド メソッドを次のものに置き換えます。

$(document).on('click', '.close_link', function() {
  alert('hello from binded function call');
});

これにより、リンクが動的に追加された場合でも、リンクをクリックするとクリック イベントが確実にトリガーされます。動的に追加された要素のイベントを処理するには、$(document).on() を使用したイベント委任が重要であることを覚えておいてください。

以上がjQuery で動的に追加された要素でクリック イベントが起動できないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。