Jquery计数元素点击限制

Question

首先，我有一组复选框元素，我希望每次点击它都有一种方法来计算窗体中活动的复选框的数量。接下来，限制我要检查的复选框数量，如果达到限制，则我希望禁用其余复选框。目前，jquery .length返回复选框的总数。

不过，我正在使用自定义的javascript / css复选框，但我认为这个想法是一样的

Answer 1

为了检索已选中复选框的数量，.length可以在选择器input:checked上运行：

var nbChecked = $("input:checked").length;

为了限制复选框的数量，您必须将change事件绑定到复选框，并在达到此数字时阻止点击...

工作jsFiddle：http://jsfiddle.net/wpMzY/

Answer 2

如果您粘贴了已有的代码 - 我们可以进一步建议。

• 要查看如何选中复选框，请查看：Check checkbox checked property using jQuery

• 要查看如何选中/取消选中复选框：How do I check a checkbox with jQuery

• 有关启用和停用的信息，请查看：JQuery - checkbox enable/disable

Answer 3

Samuel已经回答的完整代码示例，以及允许用户取消选择其当前选项并选择其他选项的选项：

var maxAmountChecked = 3;

$('input[type=checkbox]').change(function(){
   if( $('input:checked').length > maxAmountChecked-1 ){
       //disable all unchecked checkboxes, keeping checked boxes available to deselect
       $('input:checkbox:not(:checked)').attr('disabled', 'disabled');
   }else{
       //if maximum amount is not reached, all checkboxes should be available
       $('input[type=checkbox]').removeAttr("disabled");
   }
});