Javascript/jQuery-单击时删除复选框值

…我正在计算复选框的数量，当达到最大数量时，我需要确保不允许选择其他复选框

像这样

IF(..some condition..)
{
  // do the deed
}
ELSE
{
  $('input[type="checkbox"]').on('click', function(event)
  {
    $(this).parent().removeClass("c1-item-selected");  // removing CSS
    $(this).parent().val="";  // hoping to remove value "checked"
  });
}

我试图替换$（this.parent（）.val=”“带有：事件。preventDefault（）；event.stopPropagation（）但这不是正确的方法选择。它仍然允许我选中任何复选框，实际上阻止了我以后取消选中它。因此，我想我只需将任何单击的复选框的值设置为null或（“”），然后删除样式，这样看起来就不允许选择其他复选框，但似乎不需要：）

---

如何防止在到达ELSE语句时选中复选框？

要禁止选中复选框，正确的方法是设置

禁用属性：

$('_select your cb').prop('disabled', true);

如果我正确理解了您的代码，那么：

$('input[type="checkbox"]').on('click', function(event) {
    $(this).parent().removeClass("c1-item-selected");  // removing CSS
    $(this).parent().val="";  // hoping to remove value "checked"
});

应该是

$('input[type="checkbox"]').prop('disabled', true);


编辑

根据您的评论，您似乎希望启用复选框，但用户无法选中任何其他复选框。您的最佳选择是维护一个简单的布尔跟踪，以确定用户是否可以检查其他内容，并执行以下操作：

var canCheckNew = false;

//gets set somehow

$('input[type="checkbox"]').on('click', function(event) {
    if (!canCheckNew && this.checked){
        this.checked = false;
    }
});

这就是说，这可能会给您的用户带来一个非常恼人的用户界面，其中复选框看起来是启用的，但不能被选中。
要禁止复选框被选中，正确的方法是设置
disabled
属性：

$('_select your cb').prop('disabled', true);

如果我正确理解了您的代码，那么：

$('input[type="checkbox"]').on('click', function(event) {
    $(this).parent().removeClass("c1-item-selected");  // removing CSS
    $(this).parent().val="";  // hoping to remove value "checked"
});

应该是

$('input[type="checkbox"]').prop('disabled', true);


编辑

根据您的评论，您似乎希望启用复选框，但用户无法选中任何其他复选框。您的最佳选择是维护一个简单的布尔跟踪，以确定用户是否可以检查其他内容，并执行以下操作：

var canCheckNew = false;

//gets set somehow

$('input[type="checkbox"]').on('click', function(event) {
    if (!canCheckNew && this.checked){
        this.checked = false;
    }
});

这就是说，这可能会给您的用户带来一个非常恼人的用户界面，其中复选框似乎已启用，但无法选中。
2014更新如下：

请注意（对于jQuery版本>1.6），应使用
prop（）
而不是
attr（）
——请参阅：




因此，在下面的示例中：

                    if (checked > 2) {
                        $("input:checkbox:not(:checked)").prop('disabled',true);
                    }else{
                        $('input[type=checkbox]').prop('disabled',false);
                    }

更新的JSFIDLE:


原始答案：

这就是你的想法吗？（工作示例，只需剪切/粘贴并尝试）

修订：

当选中3个复选框时，此修订代码将禁用所有未选中的复选框。如果取消选中一个复选框，则会重新启用所有未选中的复选框



$（文档）.ready（函数（）{
var=0；
$（'input[type=“checkbox”]”）。单击（函数（）{
var$b=$（'input[type=checkbox]'）；
选中=$b.filter（':checked'）。长度；
//警报（“存在['+选中+']个选中复选框”）；
/***请参见顶部注释：使用PROP（）而不是ATTR（）***/
如果（选中>2）{
$（“输入：复选框：未（：选中）”）.attr（'disabled'，'disabled'）；
}否则{
$（'input[type=checkbox]'）。removeAttr（'disabled'）；
}
});
}); //END$（document.ready（））
最多允许选中三个复选框，然后禁用页面上的所有复选框
我有一辆自行车
我有一辆车

我有一把勺子

我有一把吉他

我有一条船

我有一所房子

2014年更新如下：

请注意（对于jQuery版本>1.6），应使用
prop（）
而不是
attr（）
——请参阅：




因此，在下面的示例中：

                    if (checked > 2) {
                        $("input:checkbox:not(:checked)").prop('disabled',true);
                    }else{
                        $('input[type=checkbox]').prop('disabled',false);
                    }

更新的JSFIDLE:


原始答案：

这就是你的想法吗？（工作示例，只需剪切/粘贴并尝试）

修订：

当选中3个复选框时，此修订代码将禁用所有未选中的复选框。如果取消选中一个复选框，则会重新启用所有未选中的复选框



$（文档）.ready（函数（）{
var=0；
$（'input[type=“checkbox”]”）。单击（函数（）{
var$b=$（'input[type=checkbox]'）；
选中=$b.filter（':checked'）。长度；
//警报（“存在['+选中+']个选中复选框”）；
/***请参见顶部注释：使用PROP（）而不是ATTR（）***/
如果（选中>2）{
$（“输入：复选框：未（：选中）”）.attr（'disabled'，'disabled'）；
}否则{
$（'input[type=checkbox]'）。removeAttr（'disabled'）；
}
});
}); //END$（document.ready（））
最多允许选中三个复选框，然后禁用页面上的所有复选框
我有一辆自行车
我有一辆车

我有一把勺子

我有一把吉他

我有一条船

我有一所房子

。是的，乍一看似乎是正确的，但不幸的是，这会“冻结”所有复选框，并且不允许访问者修改他们以前的任何选择。还有其他解决方案吗？我假设有说明告诉用户，他们最多只能选择X个选项。如果是，则添加一个计数器，该计数器随复选框的数量而变化。一旦它们达到极限，就禁用其余的，直到它们取消选中以前选中的框为止。@iKnowKungFoo——事实上——这将是一个很好的设计方法it@Milan.prop（'disabled'，true）可能不是启用/禁用复选框的最佳方式。看科比的解释，还有我上面的答案……好的，一个接一个的回答。是的，有一条提示消息