動的に追加された要素にイベントをバインドする jQuery のメソッド_jquery

この記事の例では、jQuery が動的に追加された要素にイベントをバインドする方法を説明します。皆さんの参考に共有してください。具体的な分析は次のとおりです。

jquery でのイベントのバインドには通常、bind または click が使用されますが、これはロードされた要素のイベントのみを定義でき、後で追加および挿入される要素は個別にバインドする必要があります。バージョン 1.7 より前のライブを使用してください。ただし、バージョン 1.8 以降での使用を推奨します。ここでは、jQuery
で動的に追加された要素にイベントをバインドする方法を紹介します。 実際の開発では、動的に生成された HTML 要素にトリガー イベントをバインドする必要がある状況に遭遇することになります

たとえば

<div id="testdiv">
  <ul></ul>
</div>

内に動的に追加された

タグにクリック イベントを追加する必要があります。
jquery バージョン 1.7 より前は、ライブ動的バインディング イベントが使用されていました

$("#testdiv ul li").live("click",function(){
});

jquery バージョン 1.7 以降では、on を使用してイベントを動的にバインドします

$("#testdiv ul").on("click","li", function() {
     //do something here
 });

この記事が皆さんの jQuery プログラミングに役立つことを願っています。