首页 > 解决方案 > jQuery removeClass() 有时有效,但有时无效

问题描述

我正在尝试更多地了解 jQuery。我正在尝试从复选框中清除“活动”类。按钮组中有两个复选框。请参见下面的代码:

<!--    MAIN BODY       -->
<div id="container">
    <div id="row">
        <div class="col-md-1">
            <div id="" class="btn-group" role="group" >
                <div class="btn-group" data-toggle="buttons">
                    <label class="btn btn-primary active" id = "clear" >
                    <input type="checkbox" id="cbclear" name="tool_option_myCanvas" data-tool="clear" data-toggle="tooltip" data-placement="bottom" title="title"> 
                    <span class="fa fa-undo"></span>
                    </label>
                    <label class="btn btn-primary" id = "btn2" >
                    <input type="checkbox" name="tool_option_myCanvas" data-tool="fg" data-toggle="tooltip" data-placement="bottom" title="title"> 
                    <span class="fa fa-eraser"></span>
                </label></div>
            </div>
        </div>
    </div>
</div>
<script>

(function($) {

    $("#btn2").click(function() {
        $("#clear").removeClass("active");
    });
    $('#clear').click(function() {
        $("#clear").removeClass("active");
}); 
})(jQuery);

如果我单击 btn2,它将删除“活动”类,并按预期工作。如果我单击清除,则没有任何反应。

我尝试过的另一件事是,当我将点击处理程序替换为“清除”时:

    $('#clear').click(function() {
        $("#clear").removeClass("btn-primary active");
}); 

类“btn-primary active”被删除。那么,为什么当我单击“清除”按钮时不能单独删除活动类?我的最终目标是在单击“活动”按钮时删除“活动”类。

标签: jquery

解决方案


我使用了这个:Twitter Bootstrap:删除/切换类似复选框的按钮组的活动状态

    $('#clear').click(function(event) {
        event.stopImmediatePropagation();
        $("#clear").removeClass("active");
}); 

推荐阅读