Question

添加了类disabled后，我尝试使用jquery禁用自定义复选框。以下是我到目前为止所尝试的代码。

$('span').click(function(e){
        $(this).toggleClass('active');
});
$('.disabled').click(function(e){
    e.stopPropagation();
    return false;
});

CSS

span{
    width: 16px;
    height: 16px;
    display: inline-block;
    cursor: pointer;
    background-color: gray;
}
span.disabled{
    cursor: not-allowed;
}
cite.fa-check{
    font-size: 14px;
    color: #fff;
    margin-left: 1px;
    display: none;
}
span.active cite.fa-check{
    display: inline-block;
}

如果我在我的复选框中添加课程disabled，我的活动就不会有效。任何帮助，将不胜感激。提前谢谢。

Working Demo

Answer 1

将代码更新到下面。 jquery not（）选择器避免上述元素的事件。您不需要使用$（＆＃39; .disabled＆＃39;）点击事件。

查看fiddle

上的工作演示

$('span').not('.disabled').click(function(e){
    $(this).toggleClass('active');
});

Answer 2

您可以使用hasClass

你只需要这个js

$('span').click(function(e){
    if($(this).hasClass( "disabled" )==false){
        $(this).toggleClass('active');
    }
});

检查此fiddle

Answer 3

通过检查是否存在类

来检查被点击的元素是否被禁用

$('span').click(function(e){

    if($(this).hasClass("disabled"))
    {
        return false;

    }
    else
    {
        $(this).toggleClass('active');
    }
});


$('.disabled').click(function(e){
    return false;
    e.stopPropagation();

});

如何禁用自定义复选框的click事件

3 个答案: