1

これはちょっと単純なコードなので、それが何をするのかは説明しません。

ここでの問題は、 divをクリックしてから.likes.1divをクリックした後.likes.2、再びdiv.likes.1が表示されることです.article-info。

したがって、属性の名前が削除されても、それでもそのタスクを実行します。

どうしてこんなことに ？

$(document).ready(function() {

    $(".likes.1[surname|='first']").click(function() {
        generate('information');
        $(this).removeAttr('surname');
        $(".article-info").show();
    });

    $(".likes.2").click(function() {
        $(".article-info").hide();
    });
4

1 に答える 1

2

クリック イベントのバインドは、ページの読み込み時、またはより正確には DOM の準備が整ったときに発生します。

$(".likes.1[surname|='first']").click(function() { ... })

これにより、ページロード時にそのセレクターに一致するすべての要素にイベントがバインドされます。後でそのセレクターに関連する属性、クラス、ID、またはその他のものを削除しても、イベントは既にバインドされているため、それは変更されません。

委任されたハンドラーはクリックごとにセレクターをチェックするため、イベントのバインドを解除するか、委任されたイベント ハンドラーを使用する必要があります。

$(document).on("click", ".likes.1[surname|='first']", function() { ... })

ドキュメントの代わりに、ターゲット要素に最も近い使用可能な親を使用する必要があります (また、数字だけで構成されるクラスは一般的にはお勧めできません)。

または次のようなもの：

$(".likes.1[surname|='first']").on('click', function() {
    generate('information');
    $(this).off('click');
    $(".article-info").show();
});
于 2013-02-10T18:29:32.680 に答える