如何使用引导 4 个按钮组向复选框表单添加最大值

Question

我有这个表格，其中包含使用复选框和单选按钮的问题，复选框问题可以有最大数量的检查才能转到下一个问题。对于复选框和单选按钮，我正在使用引导按钮。

https://getbootstrap.com/docs/4.1/components/buttons/#checkbox-and-radio-buttons

我使用 jquery 更改函数来查看复选框何时发生某些情况，当某些内容发生变化时，我检查选中了多少并将其与最大数量进行比较。如果检查量高于最大值，则我取消选中刚刚选中的复选框。这样做的问题是，当复选框取消选中时，它会更改复选框，我得到一个无限循环，最终得到错误"太多递归"。

关于我如何完成这项工作的任何线索？我尝试过 .click 而不是 .change，但是当我得到检查量时，它给了我错误的数字。

脚本：

function checkboxHandler(aThis){
if($('.pro-block.pb-active').find('.proanalysecheck:checked').length > $(aThis).data('max')) {
if($(aThis).prop('checked') == true){
$(aThis).parent('label').button('toggle');
}
}
}

$('#frmProinvite .proanalysecheck').change( function(e) {
checkboxHandler(this);
});

.pb-block.pb-active是当前问题div，.proanalysecheck是输入类。

Answer 1

使用指示更改是由达到最大选择数引起的标志怎么样？这应该可以完成这项工作。

var changeByMaxReached = false; 
function checkboxHandler(aThis){
if(!changeByMaxReached && $('.pro-block.pb-active').find('.proanalysecheck:checked').length > $(aThis).data('max')) {
if($(aThis).prop('checked') == true){
changeByMaxReached = true;
$(aThis).parent('label').button('toggle');
}
}
}

$('#frmProinvite .proanalysecheck').change( function(e) {
if (!changeByMaxReached) {
checkboxHandler(this);
} 
changeByMaxReached = false;
});