使用iCheck限制已选中复选框的数量

时间:2013-09-19 23:38:29

标签: jquery checkbox icheck

我正在使用iCheck来设置复选框样式,而我在使用旁边验证时遇到了麻烦。基本上我需要允许一次检查3个复选框,并防止进一步检查框。

我尝试过使用它:

$("#modal1").on("change", function()
{
  var limit = 3,
      checkboxes = $(this).find("input:checkbox"),
      valid = checkboxes.filter(":checked").length >= limit;

    checkboxes.not(":checked").attr("disabled", valid);
    $('input').iCheck('update');
});

如果没有iCheck,它可以在下面看到,但我无法让iCheck更新。

http://jsfiddle.net/hUdrF/4/

3 个答案:

答案 0 :(得分:4)

我添加了.on("ifToggled"加上SpaceDog的代码,解决了这个问题。

$("#modal1").on("ifToggled", function() {
    checkboxes = $(this).find("input:checkbox");  
    if (checkboxes.filter(":checked").length >= 3) { 
        checkboxes.not(":checked").iCheck('disable'); 
    } else { 
        checkboxes.not(":checked").iCheck('enable');
    } 
});

答案 1 :(得分:2)

看起来iCheck更新方法没有看到对disabled属性的更改。您可以尝试使用本机iCheck方法来禁用复选框:

if (checkboxes.filter(":checked").length >= limit) { 
    checkboxes.not(":checked").iCheck('disable'); 
} else {
    checkboxes.not(":checked").iCheck('enable'); 
}

答案 2 :(得分:0)

在代码中进行一些更改

    $("#modal1").on("change", function()
    {
    var limit = 2;
    $('.check').on('ifChanged', function(event) {
        checkboxes = $('.icheck-list').find("input:checkbox");
        if (checkboxes.filter(":checked").length >= limit) {
            checkboxes.not(":checked").iCheck('disable');
        } else {
            checkboxes.not(":checked").iCheck('enable');
        }
    });
    });
相关问题