Question

当我单击标签仅尝试删除班级时遇到麻烦。添加类效果很好，但是removeClass（）却不能我的html上有

            <div class="row">
                <div class="col-sm-2">
                    <h4>Ambiente</h4>
                    <ul>
                        <li><a>Baño</a></li>
                        <li><a id="ambienteCocina">Cocina</a></li>
                        <li><a>Dormitorio</li>
                        <li><a>Jardin</li>
                        <li><a>Living</li>
                    </ul>
                </div>

                <div class="col-sm-10 " style="border-left: 1px solid black">
                    <div id="contenedorOpcionesBano" class="opcionesAmbiente opcionesAmbienteActivo">
                    </div>
                </div>

然后它起作用了

$(document).on('click', '#ambienteCocina', function(e){ 
    $("#contenedorOpcionesBano").addClass("opcionesAmbienteActivo");
});

但事实并非如此！

$(document).on('click', '#ambienteCocina', function(e){ 
    $("#contenedorOpcionesBano").removeClass("opcionesAmbienteActivo");
});

有什么主意吗？

编辑：：

我也尝试过这种方法，但仍然无法正常工作

html已修改：

                <li><a id="ambienteCocina" onclick="cambiarAmbiente()">Cocina</a></li>

.JS修改：

function cambiarAmbiente() {
    $("#contenedorOpcionesBaño").removeClass("opcionesAmbienteActivo");
    console.log("CHanged");
}

但是，会显示登录控制台！

Answer 1

问题出在我的.css文件上，

我有那些风格：

 .opcionesAmbiente {
    display: none;
}
.opcionesAmbiente .opcionesAmbienteActivo {
    display: block;
}

这意味着.opcionesAmbienteActive必须是.opcionesAmbiente的子级。因此它是通过以下方式解决的：

.opcionesAmbiente {
    display: none;
}
.opcionesAmbiente.opcionesAmbienteActivo {
    display: block;
}

指的是具有.opcionesAmbiente机器人和.opcionesAmbienteActivo机器人的元素

Answer 2

在此代码段中，您可以验证代码是否正常运行。也许您可以发布您的CSS

$(document).on('click', '#ambienteCocina', function(e){ 
    $("#contenedorOpcionesBano").removeClass("opcionesAmbienteActivo");
});

.opcionesAmbienteActivo{
  color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="row">
    <div class="col-sm-2">
        <h4>Ambiente</h4>
        <ul>
            <li><a>Baño</a></li>
            <li><a id="ambienteCocina">Cocina</a></li>
            <li><a>Dormitorio</a></li>
            <li><a>Jardin</a></li>
            <li><a>Living</a></li>
        </ul>
    </div>

    <div class="col-sm-10 " style="border-left: 1px solid black">
      <div id="contenedorOpcionesBano" class="opcionesAmbiente opcionesAmbienteActivo">
        opcionesAmbienteActivo
      </div>
    </div>
</div>

作为观察，在列表中，最后3个<a>没有关闭

如果要添加或删除类，建议您使用jQuery toggleClass。允许根据类的存在来添加或删除类

Answer 3

您可以尝试：

obj = User.query.filter(User.uname == username, User.pwd == password).first()

或

先关闭再使用，再打开

jQuery的不删除类

3 个答案: