jquery - 向 id 添加和删除类

Question

当我点击类显示'id不返回类隐藏你能帮帮我吗？谢谢

CSS

    .hide{color: red}
    .show{ color: green}

HTML

<div id="prova" class="hide">
    prova
</div>

jQuery

$(document).ready(function()
    {
        $("#prova.hide").click(function()
        {

            $(this).removeClass();
            $(this).addClass("show")
        })
        $("#prova.show").click(function()
        {

            $(this).removeClass();
            $(this).addClass("hide")
        })

    })

Answer 1

尝试这个：

$("#prova").click(function(){
    $(this).toggleClass('show hide');
});

在这里演示

Answer 2

当您更改课程时，您的点击事件不受约束。因此，当您更改类时，元素不再具有与之关联的事件。

    $(document).on('click', "#prova.hide", function()
    {

        $(this).removeClass();
        $(this).addClass("show")
    })
    $(document).on('click', "#prova.show", function()
    {

        $(this).removeClass();
        $(this).addClass("hide")
    })

Answer 3

当$("#prova.hide").click(被调用时，该click函数仅应用于在代码运行时与选择器匹配的那些元素。 您应该改为执行以下操作：

$("#prova").click(function()
{
    var $this = $(this);

    if($this.hasClass("show")){
        $this.removeClass("show");
             .addClass("hide");
    } else {
        $this.removeClass("hide");
             .addClass("show");
    }
});