1. instance source code
Copy codeThe Code is as follows:
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Title> val () in jQuery </title>
<Script type = "text/javascript" src = "jquery-2.1.0.js"> </script>
<Script type = "text/javascript">
$ (Function (){
$ ("# Btn"). click (function (){
$ ("Input [name = ckb]: checked"). each (function (){
Alert ($ (this). val ());
});
});
});
</Script>
</Head>
<Body>
<Div id = "div1">
<Table>
<Tr>
<Td>
<Input type = "checkbox" id = "ckb1" name = "ckb" value = "basketball"/> basketball
<Input type = "checkbox" id = "ckb2" name = "ckb" value = "football"/> football
<Input type = "checkbox" id = "ckb3" name = "ckb" value = "Volleyball"/> volleyball
</Td>
</Tr>
<Tr>
<Td>
<Input type = "button" id = "btn" value = "value"/>
</Td>
</Tr>
</Table>
</Div>
</Body>
</Html>
2. The result is as follows:
(1) Select All
Pop-up "basketball, football, and volleyball"
(2) Selected Parts
The corresponding values are displayed in sequence.
(3) All are not selected
No window pops up