jQuery获取checkbox的value值

复制代码
 1 以下为使用JQuery获取input checkbox被选中的值代码:
 2 
 3 <html>
 4     <head>
 5         <meta charset="gbk">
 6         <!-- 引入JQuery -->
 7         <script src="jquery-1.3.1.js" type="text/javascript"></script>
 8     </head>
 9 
10     <body>
11         <input type="checkbox" value="橘子" name="check">橘子1</input>
12         <input type="checkbox" value="香蕉" name="check">香蕉1</input>
13         <input type="checkbox" value="西瓜" name="check">西瓜1</input>
14         <input type="checkbox" value="芒果" name="check">芒果1</input>
15         <input type="checkbox" value="葡萄" name="check">葡萄1</input>
16         
17         <input type="button" value="方法1" id="b1">
18         <input type="button" value="方法2" id="b2">
19 
20 
21     </body>
22     
23     <script>
24         //方法1
25         $("#b1").click(function(){
26             //$('input:checkbox:checked') 等同于 $('input[type=checkbox]:checked')
27             //意思是选择被选中的checkbox
28             $.each($('input:checkbox:checked'),function(){
29                 window.alert("你选了:"+
30                     $('input[type=checkbox]:checked').length+"个,其中有:"+$(this).val());
31             });
32         });
33         
34         //方法2
35         $("#b2").click(function(){
36             $.each($('input:checkbox'),function(){
37                 if(this.checked){
38                     window.alert("你选了:"+
39                         $('input[type=checkbox]:checked').length+"个,其中有:"+$(this).val());
40                 }
41             });
42         });
43     </script>
44 </html>
复制代码

 

posted @   Mrzxs  阅读(3879)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
阅读排行:
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· 单线程的Redis速度为什么快?
点击右上角即可分享
微信分享提示
more_horiz
keyboard_arrow_up dark_mode palette
选择主题