0

如何根据选中的单选按钮的值限制可以对一组复选框进行的检查次数。

假设我有 3 个选项单选按钮。

Option 1 with value of 1 
Option 2 with value of 2
Option 3 with value of 3

然后我有3个复选框。

Checkbox 1
Checkbox 2
Checkbox 3

默认情况下，复选框被禁用，没有选中任何单选按钮。如果我选中选项 1 单选按钮 - 所有复选框均已启用，我必须且仅在 3 个中选择 1 个 如果我选中选项 2 单选按钮 - 所有复选框已启用且我必须且仅在 3 个中选择 2 个 如果我选中选项3 单选按钮 - 所有复选框均已启用，我必须选择所有复选框。

我有一些东西我开始使用 JSFiddle 但我不太擅长 Javascript 并且需要一些帮助..

更新：http: //jsfiddle.net/wF38X/

<div id="radioButtons">
    <input type="radio" name="quantity" id="radio1">
    <input type="radio" name="quantity" id="radio2">
    <input type="radio" name="quantity" id="radio3">
</div><!-- radioButtons -->
<hr />
<div id="checkBoxes">
    <input type="checkbox" name="color">
    <input type="checkbox" name="color">
    <input type="checkbox" name="color">
</div><!-- checkBoxes -->​
4

1 回答 1

1

这应该做你需要的。我没有使用单选值，而是使用单选的索引来确定需要禁用和取消选中哪些复选框。

var $radios = $('#radioButtons input:radio');
var $checks = $('#checkBoxes input:checkbox').prop('disabled', true);

$radios.change(function() {
    var idx = $radios.index(this);
    $checks.prop('disabled', function(index) {
        return index > idx;
    }).filter(':gt('+idx+')').prop('checked',false);

});

/* validate all non disabled checkboxes are checked*/
$('button').click(function() {
    var missingChecks = $checks.filter(function() {
        return !this.checked && !$(this).prop('disabled');
    }).length;

    if (missingChecks) {
        alert('Not all checkboxes selected')
    }    
});

演示：http: //jsfiddle.net/C6SpM/18/

于 2012-11-14T00:49:19.663 回答