過去には、jQueryのバインドをイベントに直接使用していました。ただし、その時点では、DOM要素を動的に生成しませんでしたが、元々イベントバインディングのページに存在していたDOM要素が生成されました。最近、動的に生成されたDOMバインディングイベントをテストしたとき、イベントが無効であることがわかりました。
1。イベントの失敗の原因：
（1）結合イベント結合は、DOMに存在する要素に対してのみ有効です。後で動的に追加する要素を監視することはできないため、拘束することはできません。
（2）同様に、var aa = document.getElementsByTagname（ "dynamic generated element"）を使用する場合。動的に生成された要素を取得するには、Webページは初期化バインディングを1回だけ実行し、その後動的に生成されたDOM要素を監視できないためです。
2。解決策：
（1）このブログの例など、動的に生成された各場所でさらに多くのイベントをバインドします
（2）Liveはリアルタイムで監視され、新しく追加されたDOM要素にも効果的であるため、Liveにバインドを変更します（常に拘束力と判断と判断であるため、Webパフォーマンスの問題に影響する可能性があります）
（3）代表者はリアルタイムで監視されるため、バインドを委任に変更します。
（4）jQuery1.7では、bind（）、live（）、およびdelegate（）メソッドがonに置き換えられました。
3。最近のイベントの失敗の理由について：元のWebページ（コードはhttps://github.com/ufowl/ife/tree/master/stage02/task16で見ることができます）、削除ボタンを削除するのに役立つ削除ボタンを削除するのに役立つ削除ボタンをテーブルで動的に生成します。イベントのバインディングを初期化すると、取得したテーブルのボタンはすでに空になっているため、バインドされた要素が常に空になるため、ボタンをクリックすると応答がありません。
4.最終解決策：最初にテーブルを取得し、次にテーブルのクリックイベント（テーブルが既に存在するDOM要素にあるため）にバインドし、イベントのターゲットをキャプチャします（たとえば、テーブルのボタンをクリックします。この時点で、ボタンがテーブルに生成され、ボタンが存在するため、ボタンが存在します。
注：2つの問題がここに記載されています。
（1）テーブル内の要素がテーブルに追加されているので、そのボタンをクリックすると、あなたが取得するボタンはあなたが望むものです。
（2）なぜボタンがテーブルに追加されたのに、それでも取得できないのですか？テーブル内のボタンは初期化されたときに取得されるため、現時点では操作は実行されていないため、取得されるものは空であるため、要素はありません。
上記に注意を払う必要がある2つの問題は明確に区別されなければならず、これが問題の鍵です。
5。バインドについて：各バインディングイベントの後、イベントはバインドされます。それ以外の場合は、イベントが常に存在します。したがって、プロジェクトに取り組むとき、AJAX要求の結果が1、2、4、8のように重ね合われることがあります。BINDが使用されると、各トリガーイベントが操作にバインドされるためです。したがって、初めてトリガーされると、Ajaxリクエストが一度要求されます。 2回目がトリガーされると、Ajaxリクエストは1+1 = 2回になります。 3回目は1+2+1 = 4回です。 4回目は、1+2+4+1 = 8回などです。したがって、Bindを使用してイベントをバインドする場合、最初に要素の元のイベントを解除してからイベントにバインドする必要があります。
DOMバインディングインシデントの動的生成の失敗の理由と解決策に関する上記の記事は、編集者が共有するすべてのコンテンツです。私はそれがあなたに参照を与えることができることを願っています、そして私はあなたがwulin.comをもっとサポートすることを願っています。