使用 jquery 单击按钮时如何切换 class 属性？

Question

这里我尝试更改class属性。但是我失败了。如何切换 class 值。

    <button id="mybt" class="fa fa-plus"></button>

    <script>

       $("#mybt").click(function() {
       $("#mybt").toggleClass("fa fa-minus");
       });

    </script>

Jsfiddle:http://jsfiddle.net/rajagopalx/u654oco8/

Answer 1

$("#mybt").on("click", function(){
    $(this).toggleClass("fa-plus fa-minus");
})

针对您的具体案例进行了编辑

Answer 2

您在使用选择器时应该具体。如果你想切换 fa-plus 和 fa-minus 那么你应该只在 jquery 选择器中使用那些 class 名称。

您还应该删除现有的 css class 以显示“+”图标并添加 css class 以显示“-”图标。

$("#mybt").click(function(){
    $("#mybt").toggleClass("fa-plus");
    $("#mybt").toggleClass("fa-minus");
});

我对上述问题的解决方案是http://jsfiddle.net/u654oco8/3/检查一下

使用 jquery 单击按钮时如何切换 class 属性？

How to toggle class attribute when button is clicked using jquery?

jquery

html

font-awesome