Implementation requirements:
The HTML structure is as follows:
1 <Table>2 <TR>3 <th><inputtype= "checkbox"name=""ID=""class= "All" />Select All</th>4 <th>check box Select All sample</th>5 </TR>6 <TR>7 <TD><inputtype= "checkbox"name=""ID="" />1</TD>8 <TD>Demand:</TD>9 </TR>Ten <TR> One <TD><inputtype= "checkbox"name=""ID="" />2</TD> A <TD>A. Click the column header check box to select All or all of the subkeys</TD> - </TR> - <TR> the <TD><inputtype= "checkbox"name=""ID="" />3</TD> - <TD>B. Uncheck the column header if one of the subkeys is not selected</TD> - </TR> - <TR> + <TD><inputtype= "checkbox"name=""ID="" />4</TD> - <TD>C. When all sub-items are selected, the column header check box is automatically selected</TD> + </TR> A <TR> at <TD><inputtype= "checkbox"name=""ID=""class= "Reverse"/>Inverse selection</TD> - <TD>D. Select the check box in reverse</TD> - </TR> - </Table>
The JS code is as follows:
1$ ('. All '). Click (function(){2 if($( This). Is (': Checked '))){3$ (' input[type=checkbox] '). Not ('. Reverse '). Prop (' checked ', ' checked '));4}Else{5$ (' input[type=checkbox] '). Not ('. Reverse '). Removeprop (' checked '))6 }7 });8$ ('. Reverse '). Click (function(){9 varLength = $ (' TD Input[type=checkbox] '). Not ('. Reverse ')). length;Ten$ (' TD Input[type=checkbox] '). Not ('. Reverse ').function(){ One if($( This). Is (': Checked '))){ A$( This). Removeprop (' checked '); -}Else{ -$( This). Prop (' checked ', ' checked '); the } - }); - }); -$ (' TD Input[type=checkbox] '). Click (function(){ + varLength1 = $ (' td:checked '). Not ('. Reverse ')). length; - varLength2 = $ (' TD Input[type=checkbox] '). Not ('. Reverse ')). length; + if(Length1! =length2) { A$ ('. All '). Removeprop (' checked ')); at}Else { -$ ('. All '). Prop (' checked ', ' checked ')); - } -});
Implementation of checkbox selection and inverse selection for module code