Global and select the radio the following two relationships:
1, when I have chosen to put all the radio on when the election should be all-state selection
2, when I cancel a radio, the whole election should be canceled state
If the relationship between the global selection and radio absence below two FIG occurs:
In order to implement the code more clear and easy :(, so only check box, and can be modified according to their needs)
<div> <ul> <li> <!--全选--> <input type="checkbox" id="all" class="parent_check">全选</li> </ul> </div> <div class="dataBox"> <ul > <li > <input type="checkbox" id="checkbox_1" class="son_check"> </li> </ul> <ul > <li > <input type="checkbox" id="checkbox_2" class="son_check"> </li> </ul> <div>
$ (function () {
// global checked and unchecked checkbox style
$ parentChexbox = $ ( '. parent_check '), // Select
$ dataBox = $ ( '. dataBox '), // for determining global and relationship subclass
$ sonCheckBox = $ ( '. son_check '); // check the individual subclasses
// select single global relationships
$ parentChexbox.click (function () {
var = $ $ checkboxs dataBox.find ( 'INPUT [type = "CheckBox"] ');
IF ($ (the this) .is (': the checked ')) {
$ checkboxs.prop ( "the checked", to true);
} the else {
$ checkboxs.prop ( "the checked", to false);
}
});
$ sonCheckBox.each (function () {
$ (the this) .click (function () {
IF ($ (the this) .is ( ': the checked')) {
// is determined: check whether all the individual
len = $ sonCheckBox.length var;
var NUM = 0;
$ sonCheckBox.each (function () {
IF ($ (the this) .is ( ': the checked')) {
NUM ++;
}
});
IF (NUM == len ) {
$ parentChexbox.prop ( "the checked", to true);
}
} the else {
// uncheck single, global select all uncheck
$ parentChexbox.prop ( "the checked", to false);
}
})
})
}) ;