JavaScript の動的読み込みの重複バインディングの問題

この記事は主にJavaScriptの動的ロードの繰り返しバインディングの問題を紹介しています。非常に優れており、必要な友人は参考にしてください。

データを追加するときは、動的ロードを使用してください。私が作成したこのメモを例として挙げると、以下に示すように、削除するかどうかを尋ねられます。 ただし、2 つ以上追加すると、データを削除するときに、削除を確認するメッセージが数回表示されます。

調査の結果、ついに問題が見つかりました。

Text

コンテンツが動的に追加される場合、通常、追加された p で使用する必要があるイベント (クリック イベント/変更イベントなど) が書き込まれます。私の削除イベントを例に挙げると、削除イベントはメモの追加イベントの下に記述する必要があるため、最初のデータが追加されたときに 1 回バインドされ、2 番目のデータが追加されたときに 1 回バインドされます。 、n 番目のデータが追加されると、1 回バインドされ、n 回の削除イベントがバインドされているため、n 番目のデータを削除するときに、削除を確認するプロンプトが n 回表示されます。

エラーの原因が判明したので、削除イベントをバインドする前に、最後にバインドされたイベントのバインドを解除するだけです。 コード:

//解绑
$(".deletebtn").off("click");
$(".update").off("change");
//绑定
$(".deletebtn").bind('click', delete_click);
$(".update").bind('change', change_fonts);

上記は私が皆さんのためにまとめたもので、将来皆さんのお役に立てれば幸いです。

関連記事:

ajaxを使用して中国語でjsonをフロントデスクに渡すときに疑問符が文字化けする問題の解決策

ユーザーが登録されているかどうかを判断するためにAJAXが使用されます

ajax非同期ファイルまたは画像アップロード機能を実装します

以上がJavaScript の動的読み込みの重複バインディングの問題の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。