限制可以對一組複選框執行的檢查次數基於選中的單選按鈕的值

Question

如何根據檢查的值限制可以對一組複選框執行的檢查次數單選按鈕。

說我有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 -->​ 

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

DEMO：http://jsfiddle.net/C6SpM/18/