JQuery supports full and inverse selection of check boxes. jquery Selects all check boxes.

JQuery supports full and inverse selection of check boxes. jquery Selects all check boxes.

<Ul id = "list"> <li> <label> <input type = "checkbox" value = "1"> text </label> </li> <label> <input type = "checkbox" value = "2"> text </label> </li> <label> <input type = "checkbox" value =" 3 "> text </label> </li> <label> <input type =" checkbox "value =" 4 "> text </label> </li> <li> <label> <input type = "checkbox" value = "5"> text </label> </li> <label> <input type = "checkbox ""value =" 6 "> text </label> </li> </ul> <input type =" checkbox "id =" all "> <input type =" button" value = "select all" class = "btn" id = "selectAll"> <input type = "button" value = "do not select all" class = "btn" id = "unSelect"> <input type = "button" value = "" class = "btn" id = "reverse"> <input type = "button" value = "get all selected values" class = "btn" id = "getValue">

Jquery code

$ (Function () {// select all or none $ ("# all "). click (function () {if (this. checked) {$ ("# list: checkbox "). prop ("checked", true);} else {$ ("# list: checkbox "). prop ("checked", false) ;}}); // select $ ("# selectAll "). click (function () {$ ("# list: checkbox, # all "). prop ("checked", true) ;}); // do not select all $ ("# unSelect "). click (function () {$ ("# list: checkbox, # all "). prop ("checked", false) ;}); // reselect $ ("# reverse "). click (function () {$ ("# List: checkbox"). each (function () {$ (this). prop ("checked ",! $ (This ). prop ("checked") ;}); allchk () ;}); // set the Select All check box $ ("# list: checkbox "). click (function () {allchk () ;}); // obtain the value of the selected option $ ("# getValue "). click (function () {var valArr = new Array; $ ("# list: checkbox [checked]"). each (function (I) {valArr [I] = $ (this ). val () ;}); var vals = valArr. join (','); alert (vals) ;}); function allchk () {var chknum =$ ("# list: checkbox "). size (); // The total number of options var chk = 0; $ ("# list: checkbox "). each (function () {if ($ (this ). prop ("checked") = true) {chk ++;}); if (chknum = chk) {// select all $ ("# all "). prop ("checked", true);} else {// not all $ ("# all "). prop ("checked", false );}}