在jQuery或JavaScript中选中多个复选框后停止选中复选框

我想在选中了一定数量的复选框后，停止用户选中另一个复选框。i、 e.勾选3个复选框后，用户无法再勾选，并显示一条消息“您不能选择3个以上的复选框。”

我就快到了，但最后一个复选框仍在被选中，我不希望这样，我希望它在消息出现时被取消选中

我如何做到这一点：

var productList = $('.prod-list'),
    checkBox = productList.find('input[type="checkbox"]'),
    compareList = $('.compare-list ul');

productList.delegate('input[type="checkbox"]', 'click', function () {
  var thisElem = $(this),
      thisData = thisElem.data('compare'),
      thisImg = thisElem.closest('li').find('img'),
      thisImgSrc = thisImg.attr('src'),
      thisImgAlt = thisImg.attr('alt');

  if (thisElem.is(':checked')) {
    if ($('input:checked').length < 4) {

        compareList.append('<li data-comparing="' + thisData + '"><img src="' + thisImgSrc + '" alt="'+ thisImgAlt +'" /><li>');

    } else {
        $('input:checked').eq(2).attr('checked', false);
        alert('You\'re not allowed to choose more than 3 boxes');
    }
  } else {
    var compareListItem = compareList.find('li');

    for (var i = 0, max = compareListItem.length; i < max; i++) {
        var thisCompItem = $(compareListItem[i]),
            comparingData = thisCompItem.data('comparing');

        if (thisData === comparingData) {
            thisCompItem.remove();
        }
    }

  }

});

var productList=$（'.prod list'），
checkBox=productList.find（'input[type=“checkBox”]”），
compareList=$（'.compareList ul'）；
productList.delegate（'input[type=“checkbox”]”，'click'，函数（）{
var thisElem=$（此），
thisData=thisElem.data（'compare'），
thisImg=thisElem.closest（'li'）。find（'img'），
thisImgSrc=thisImg.attr（'src'），
thisImgAlt=thisImg.attr（'alt'）；
如果（thisElem.is（':checked'））{
如果（$（'input:checked'）。长度<4）{
compareList.append（“
”）；
}否则{
$（'input:checked'）.eq（2）.attr（'checked'，false）；
警报（“不允许您选择超过3个框”）；
}
}否则{
var compareListItem=compareList.find（'li'）；
对于（变量i=0，max=compareListItem.length；i

我可能误解了这个问题。。。见我的评论

为了防止选择，您可以调用

event.preventDefault（）

并使用

event

参数定义处理程序

$('input[type="checkbox"]').click(function(event) {
    if (this.checked && $('input:checked').length > 3) {
        event.preventDefault();
        alert('You\'re not allowed to choose more than 3 boxes');
    }
});

或者，将此设置为

。选中的
设置为
false
。这甚至会阻止浏览器呈现选中标记

一个用于多个表单的jquery函数

<form>
 <input  type="checkbox" name="seg"><br>
 <input  type="checkbox" name="seg" ><br>
 <input  type="checkbox" name="seg"><br>
 <input  type="checkbox" name="seg"><br>
</form>

<br><br><br><br><br>

<form>
  <input  type="checkbox" name="seg1"><br>
 <input  type="checkbox" name="seg1" ><br>
 <input type="checkbox" name="seg1"><br>
 <input type="checkbox" name="seg1"><br>
</form>

$('input[type="checkbox"]').click(function(event) {
  if ($("input[name= "+ this.name +"]:checked").length > 3) {
        event.preventDefault();
        alert('You\'re not allowed to choose more than 3 boxes');
    }
});
























$（'input[type=“checkbox”]”）。单击（函数（事件）{
如果（$（“输入[name=“+this.name+”]：选中”）.length>3）{
event.preventDefault（）；
警报（“不允许您选择超过3个框”）；
}
});
你能分享你的HTML代码吗？哦，也许我误解了这个问题。。。您希望选中新复选框，但取消选中以前选中的复选框或第一个选中的复选框？谢谢Felix，这很有帮助