13

適用する：

$(".newContentLink").click(function() {
    $("#test").append("1");
});

これについて：

<span id="contents">
<input class="newContentLink" type="submit" style="width: 100%;" value="CREATE A NEW CONTENT"/>
<span id="content1" class="content study">
</span>
<input class="newContentLink" type="submit" style="width: 100%;" value="CREATE A NEW CONTENT"/>
<span id="content3" class="content study">
</span>
<input class="newContentLink" type="submit" style="width: 100%;" value="CREATE A NEW CONTENT"/>
<span id="content4" class="content category">
</span>
<input class="newContentLink" type="submit" style="width: 100%;" value="CREATE A NEW CONTENT"/>
</span>

最初の 2 つのボタンをクリックすると 111 が追加され、次のボタンで 11 が追加され、最後のボタンで 1 が追加されるのはなぜですか?

4

7 に答える 7

20

複製できません。私は、あなたの状況を誤って伝えているのではないかと思います — ほとんどが単純化しすぎています. $(".newContentLink").click(...)正確に言うと、これらの入力を動的に追加し、毎回呼び出していると思います。これにより、当然ながら、.newContentLinkページ内のそれぞれにクリック ハンドラーの追加のコピーが適用され続けます。

したがって、作成した最新の入力には、クリック ハンドラーの 1 つのコピーがあり、1 つが追加されます1。2 番目に新しいものには 2 つのコピーと追加があり11ます。3 番目には three と appends111などがあります。

これを防ぐには、$(".newContentLink")(常にevery .newContentLinkを意味する) ではなく、新しく作成した DOM 要素にクリック ハンドラーを適用します。

于 2009-07-24T14:45:47.307 に答える
7

または、新しい要素を追加するたびにクリックイベントのバインドを解除できます

$('.newContentLink').unbind('click');

$(".newContentLink").click(function() {
    $("#test").append("1");
});
于 2012-08-18T00:37:00.363 に答える
6

カオスが言うように、おそらくclick()追加するたびに呼び出しており、それらは蓄積されています。

これらのアイテムをドキュメントに動的に追加していて、追加するすべてのアイテムにこの機能が追加されていることを確認する必要がある場合は、ライブを使用してみてはどうでしょうか?

$('#contents').on('click', '.newContentLink', function() {
    $("#test").append("1");
});

これにより、ルールがドキュメント内の該当するクラスに 1 回動的に適用されるようになります。

于 2009-07-24T14:54:14.563 に答える
3

関数がワンクリックイベントで1回だけ実行されるようにするには、$（ "。newContentLink"）。one（）;を使用できます。

$(".newContentLink").one(function() {
    $("#test").append("1");
});
于 2012-07-18T12:55:31.453 に答える
2

jQuery のバグではありません -動作中のデモ

コード内の他の何かに問題があるはずです。マークアップの要素はどこid="test"にありますか?

編集：

もっともらしい説明のように聞こえるカオスの答えを読んでください。

ところで、要素 ID は HTML マークアップ内で一意でなければなりません - これは HTML 仕様の一部であり、別の理由として考えられるかもしれません

于 2009-07-24T14:49:26.787 に答える
1

同様の問題が発生しました...ループで変更関数を適用していることがわかりました...つまり、以前のコードは...でした。

$("table#UserIRTable > tbody > tr").each(function()
{
   ..............
   ..............

  $("input[id='thisMonthSupply']").change(function(e){  
      ......
    });
  ..........
  ..........
}

変更機能を取り出してビンゴ...それは機能しました.....

于 2009-12-03T06:06:54.847 に答える
1

送信入力要素に別の名前を付けてみてください。

于 2009-07-24T14:43:34.817 に答える