jQuery仅勾选4个复选框中的2个复选框[重复]答案

【问题标题】：jQuery only tick 2 checkboxes in group of 4 checkboxes [duplicate]jQuery仅勾选4个复选框中的2个复选框[重复]
【发布时间】：2015-02-13 00:50:11
【问题描述】：

如何在 jQuery 中实现用户只能从 4 个复选框中选择最多 2 个复选框？用户可以选择任何一个，只要它限制为 2 个复选框

这是我的代码

<http://jsfiddle.net/4xcbye6z/>

【问题讨论】：

小提琴中只有 HTML。你已经尝试过什么了吗？

标签： jquery html twitter-bootstrap

【解决方案1】：

无论如何，你没有正确发布你的小提琴，这是你的小提琴的修改版本，它完全符合你的要求。

$(function() {
  $("input[type=checkbox]").click(function(e) {
    var c = $("input[type=checkbox]:checked");
    if (c.length == 3) {
      return false;
    }

  });
});

<div class="container">
  <div class="row">
    <div class="col-sm-12">
      <div class="row">
        <div class="col-sm-2">
          <div class="tbl-info">
            <input type="checkbox" />
          </div>
        </div>
        <div class="col-sm-2">
          <div class="tbl-info">
            <input type="checkbox" />
          </div>
        </div>
        <div class="col-sm-2">
          <div class="tbl-info">
            <input type="checkbox" />
          </div>
        </div>
        <div class="col-sm-2">
          <div class="tbl-info">
            <input type="checkbox" />
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

http://jsfiddle.net/dh7evp9s/

这个想法是捕获复选框上的点击事件，如果已经有两个选中的事件，则在事件中返回 false 从而禁止它。

【讨论】：

您的代码是正确的，但有没有我们可以让它更“用户友好”的地方？截至目前，用户需要取消选中 2 个复选框中的 1 个才能更改选择。当用户选择另一个复选框时，是否可以像第二个选择一样取消选择它？
您可以通过将 return false 替换为 ($("input[type=checkbox]:checked")[0]).prop('checked',false) ;但是，取消选中最近选中的复选框是另一回事，您需要开始跟踪检查的顺序。

【解决方案2】：

可以在您的链接中找到任何代码，但这个会检查所有标记:)

var countChecked = function(e) {
   var n = $( "input:checked" ).length;
   if (n > 2) e.preventDefault();
};

$( "input[type=checkbox]" ).on( "click", countChecked );

另外，请参阅 jQuery 文档中的示例：HERE

看看jsFiddle

【讨论】：

这如何回答这个问题？
好点，应该这样做...