JSが動的にロードされるときにバインディングが繰り返される場合の対処方法

今回は、JS が動的にロードされるときにバインディングが繰り返される場合の対処方法を説明します。

前書き データを追加するときに、インターフェイスに表示するために動的読み込みを使用しました。後で、データを追加した後に作成したこのメモを見てみましょう。 ,

削除

をクリックしました。削除すると、以下のように削除するかどうかを尋ねられます:

しかし、3つ以上のデータを追加すると、削除を確認するメッセージが数回表示されます。どの部分を削除するかに応じて。

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

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);

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

初心者のためのvueの学び方

Angularの親コンポーネントが子コンポーネントを呼び出す方法

WeChatミニプログラムのwx:forとwx:for-itemの違いは何ですか

以上がJSが動的にロードされるときにバインディングが繰り返される場合の対処方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。