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!
Articles you may be interested in
- Prohibit web page right-click, copy, save as, View Source file and other functions to implement web page source code protection
- Javascript determines whether the mouse is left or right-click-compatible with ie, firefox, chrome, and other major browsers
- FckEditor shortcut menu-image deletion function
- Summary of the string truncation function implemented by javascript (including introduction to the use of Js to intercept Chinese characters)
- Run the code preview code, save the code as, and copy the implementation of the code function.
- Js shields mouse and keyboard events (including right-click, direction key, backspace key, F5 refresh key, etc.), compatible with IE and firefox
- Using JavaScript to prohibit browsers from directly copying article content
- Javascript checks whether the check box is selected