限制跨组的单选按钮选择

Question

我知道如何限制用户可以选择的复选框数量，但不知道如何使用多组单选按钮来做到这一点。

这就是场景。第一组单选按钮允许用户选择一个数字 - 从 1 到 6。我得到的值是这样的：

    $('#input_3_1 input').on('change', function() {
    var selectedVal = "";
    var selected = $("#input_3_1 input[type='radio']:checked");
    if (selected.length > 0) {
        selectedVal = selected.val();
    }
    });  

之后是一系列单选组，每个组都有多个选项，如下所示：

    <div id="input_3_2" class="limit-this">
    <input name="input_2" type="radio" value="Choice 1">
    <input name="input_2" type="radio" value="Choice 2">
    <input name="input_2" type="radio" value="Choice 3">
    </div>

    <div id="input_3_3" class="limit-this">
    <input name="input_3" type="radio" value="Choice 1">
    <input name="input_3" type="radio" value="Choice 2">
    <input name="input_3" type="radio" value="Choice 3">
    </div>

对于可变数量的字段以此类推，最多可达 10 个。

我需要用户能够在所有其他字段中仅选择第一个字段中选择的选项数。

任何人都可以在这里指出正确的方向吗？

Answer 1

$('.limit-this input[type="radio"]').click(function(){
    var a = $('.limit-this input[type="radio"]:checked').length;
    if(a>selectedVal) if($(this).is(':checked')) $(this).removeAttr('checked');
});

见DEMO

在DEMO2 中，我已启用取消选中当前选中的项目，以防用户改变主意并想要做出另一个选择：

$('.limit-this input[type="radio"]').click(function(){
    var a = $('.limit-this input[type="radio"]:checked').length;
    var b = ($(this).is(':checked')?1:0);
    if(a>selectedVal){ if($(this).is(':checked')){ $(this).removeAttr('checked');}}
    else{

     if($(this).is(':checked')&&$(this).data('val')==1) {$(this).removeAttr('checked');
         $(this).data('val', 0);  
     }else
       $(this).data('val', b);    
    }

});