Description: Matches all elements that are checked or selected.
version added: 1.0jQuery( ":checked" )
The :checked selector works for checkboxes, radio buttons, and options of select elements.
To retrieve only the selected options of select elements, use the :selected selector.
Determine how many input elements are checked.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
|
<!doctype html><html lang="en"><head> <meta charset="utf-8"> <title>checked demo</title> <style> div { color: red; } </style> <script src="https://code.jquery.com/jquery-1.10.2.js"></script></head><body><form> <p> <input type="checkbox" name="newsletter" value="Hourly" checked="checked"> <input type="checkbox" name="newsletter" value="Daily"> <input type="checkbox" name="newsletter" value="Weekly"> <input type="checkbox" name="newsletter" value="Monthly" checked> <input type="checkbox" name="newsletter" value="Yearly"> </p></form><div></div><script>var countChecked = function() { var n = $( "input:checked" ).length; $( "div" ).text( n + (n === 1 ? " is" : " are") + " checked!" );};countChecked();$( "input[type=checkbox]" ).on( "click", countChecked );</script></body></html> |
Identify the checked radio input.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
|
<!doctype html><html lang="en"><head> <meta charset="utf-8"> <title>checked demo</title> <style> input, label { line-height: 1.5em; } </style> <script src="https://code.jquery.com/jquery-1.10.2.js"></script></head><body><form> <div> <input type="radio" name="fruit" value="orange" id="orange"> <label for="orange">orange</label> </div> <div> <input type="radio" name="fruit" value="apple" id="apple"> <label for="apple">apple</label> </div> <div> <input type="radio" name="fruit" value="banana" id="banana"> <label for="banana">banana</label> </div> <div id="log"></div></form><script>$( "input" ).on( "click", function() { $( "#log" ).html( $( "input:checked" ).val() + " is checked!" );});</script></body></html> |