javascript - jqueryで書いた関数がうまく動かない

Question

ページがあります

<div id="aar">  
    <div id="stack0" class="stack">stack1</div>
    <div id="stack1" class="stack">stack1</div>
    <div id="stack2" class="stack">stack1</div>
</div>

次のスクリプトが実行されます

$(document).ready(function(){
    $(".stack").click(function(){
       $("#aar").html($("#aar").html()+'ann');
    });
});

.stack クリック機能は 1 回だけ実行されます。なぜですか?

Answer 1

これは、古い dom を新しいものに置き換えたためであり、新しいものにはバインドされたクリック イベント ハンドラーがありません。

.append メソッドを使用して新しいコンテンツを追加することもできます。

$(document).ready(function(){
    $(".stack").click(function(){
        $("#aar").append(this.id);
    });
});

Answer 2

ユーザーがクリックする代わりにライブ:

$(document).ready(function(){
$(".stack").live('click', function(){
    $("#aar").html($("#aar").html()+$(this).attr("id"));
});

}); </p>