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);    
    }

});

限制跨组的单选按钮选择

1 个答案: