Javascript 单击然后取消单击jquery按钮不工作

我试着做一个按钮，一次点击它就会改变它的颜色，另一次点击它就会回到原来的形式。 有点像点击和未点击

我添加了一个JSFIDLE供您查看。

谢谢

另外，是否有一种方法可以通过仅使用CSS HTML来实现这一点

谢谢。

jQuery hasClass函数可能会有所帮助

$('.genM').click(function() {

    if($(this).hasClass('selected')){
            $(this).removeClass('selected');
    }else{
        $(this).addClass('selected');
    }

});

我已经为您更新了js提琴，请检查

想法：

有没有办法只使用CSS HTML就可以做到这一点

是的，你可以通过纯CSS和HTML实现这一点。但是，如果您不想使用js，那么您必须有一个HTML元素，它能够在不使用js的情况下独自保持按下或未按下状态

但是，没有这样的HTML元素，所以您必须使用similar:Checkbox

已检查和未检查状态，实际上与按下或未按下状态相同

解决方案：

诀窍是使用CSS对ckeckbox进行样式化，使其在视觉上显示为按下或未按下的按钮。如何设置复选框的样式-您需要修改CSS，使其看起来像一个按钮，而不是一个切换开关

您将希望使用如下CSS选择器，如示例所示：

input[type="checkbox"]:checked { ... },
input[type="checkbox"]:checked + .slider { ... },

---

JSfiddle在哪里？JSfiddle在哪里/到目前为止你做了什么？这是你想要的吗？您首先需要学习如何使用JSFIDLE。。。jQuery应该通过JS选项卡中的选项设置嵌入，脚本选项卡浏览器控制台中没有任何标签会告诉您正在产生的语法错误。。。最后，您希望使用toggleClass。使用$this会更干净@卡斯滕洛夫博安德森是的，我同意！

$('.genM').click(function() {
    $(this).toggleClass('selected');
});

input[type="checkbox"]:checked { ... },
input[type="checkbox"]:checked + .slider { ... },