Jquery Selects all check boxes, deselect, and deselected functions based on jquery.

Jquery Selects all check boxes, deselect, and deselected functions based on jquery.

Jquery implements the functions such as full selection, reverse selection, and no selection. The following describes the examples directly. Set the following check boxes and related buttons on the page (select all, select inverse, do not select all ):

<Input type = "checkbox" name = "fruit" value = "apple"/> apple <input type = "checkbox" name = "fruit" value = "orange"/> orange <input type = "checkbox" name = "fruit" value = "banana"/> banana <input type = "checkbox" name = "fruit" value = "grape"/> grape <input type = "button" id = "btn1" value = "select all"> <input type = "button" id = "btn2" value = "do not select all"> <input type = "button" id = "btn3" value = ""> <input type = "button" id = "btn4" value = ""> <input type =" button "id =" btn5 "value =" get all selected values ">

The complete code for implementing the relevant functions is as follows:

$ (Function () {$ ('# btn1 '). click (function () {// select all $ ("[name = 'fruit']"). attr ('checked', 'true') ;}); $ ('# btn2 '). click (function () {// do not select all $ ("[name = 'fruit']"). removeAttr ('checked') ;}; $ ('# btn3 '). click (function () {// invert $ ("[name = 'fruit']"). each (function () {if ($ (this ). attr ('checked') {$ (this ). removeAttr ('checked');} else {$ (this ). attr ('checked', 'true') ;}}); $ ("# btn4 "). click (function () {// select all odd numbers $ ("[name = 'fruit']: even "). attr ('checked', 'true');}) $ ("# btn5 "). click (function () {// obtain the values of all selected options var checkVal = ''; $ (" [name = 'fruit'] [checked] "). each (function () {checkVal + = $ (this ). val () + ',';}) alert (checkVal );})});

Before using jquery, you must introduce the jquery package!

The above is the Code Compiled by xiaobian. It is very convenient to use and I hope it can help you.