《jquery猎取复选框的值的简洁实例_.docx》由会员分享，可在线阅读，更多相关《jquery猎取复选框的值的简洁实例_.docx（9页珍藏版）》请在三一文库上搜索。
1、jquery猎取复选框的值的简洁实例_ 下面我就为大家带来一篇jquery猎取复选框的值的简洁实例。我觉得挺不错的，现在就分享给大家，也给大家做个参考。 !DOCTYPE html PUBLIC -/W3C/DTD HTML 4.01 Transitional/EN l4/loose.dtd html head mce:style!- -/mce:stylestyle mce_bogus=1 /style titleJS猎取复选框被选中的值/title /head body input type=checkbox name=test value=0 /0 input type=checkbox
2、 name=test value=1 /1 input type=checkbox name=test value=2 /2 input type=checkbox name=test value=3 /3 input type=checkbox name=test value=4 /4 input type=checkbox name=test value=5 /5 input type=checkbox name=test value=6 /6 input type=checkbox name=test value=7 /7 input type=button onclick=chk()
3、value=提 交 / /body /html JS代码： mce:script src=jquery.js mce_src=jquery.js/mce:script!-这是载入jquery.js文件，假如不用法jquery可以去掉- mce:script type=text/javascript!- function chk() var obj=document.getElementsByName(test); /选择全部name=test的对象，返回数组 /取到对象数组后，我们来循环检测它是不是被选中 var s=; for(var i=0; iobj.length; i+) if(obj
4、i.checked) s+=obji.value+,; /假如选中，将value添加到变量s中 /那么现在来检测s的值就知道选中的复选框的值了 alert(s=?你还没有选择任何内容！:s); function jqchk() /jquery猎取复选框值 var chk_value =; $(inputname=test:checked).each(function() chk_value.push($(this).val(); ); alert(chk_value.length=0 ?你还没有选择任何内容！:chk_value); / -/mce:script 对checkbox的其他几个操
5、作 1. 全选 2. 取消全选 3. 选中全部奇数 4. 反选 5. 获得选中的全部值 js代码： $(document).ready(function() $(#btn1).click(function() $(name=checkbox).attr(checked,true);/全选 ) $(#btn2).click(function() $(name=checkbox).removeAttr(checked);/取消全选 ) $(#btn3).click(function() $(name=checkbox:even).attr(checked,true);/选中全部奇数 ) $(#bt
6、n4).click(function() $(name=checkbox).each(function()/反选 if($(this).attr(checked) $(this).removeAttr(checked); else $(this).attr(checked,true); ) ) $(#btn5).click(function()/输出选中的值 var str=; $(name=checkboxchecked).each(function() str+=$(this).val()+/r/n; /alert($(this).val(); ) alert(str); ) ) html
7、代码： !DOCTYPE html PUBLIC -/W3C/DTD XHTML 1.0 Transitional/EN l1/DTD/xhtml1-transitional.dtd html xmlns=l head meta http-equiv=Content-Type content=text/html; charset=utf-8 / titlelouis-blog jQuery 对checkbox的操作/title mce:script type=text/javascript src=http:/ mce_src=http:/ SCRIPT LANGUAGE=JavaScript
8、 !- $(document).ready(function() $(#btn1).click(function() $(name=checkbox).attr(checked,true);/全选 ) $(#btn2).click(function() $(name=checkbox).removeAttr(checked);/取消全选 ) $(#btn3).click(function() $(name=checkbox:even).attr(checked,true);/选中全部奇数 ) $(#btn4).click(function() $(name=checkbox).each(fun
9、ction()/反选 if($(this).attr(checked) $(this).removeAttr(checked); else $(this).attr(checked,true); ) ) $(#btn5).click(function()/输出选中的值 var str=; $(name=checkboxchecked).each(function() str+=$(this).val()+/r/n; /alert($(this).val(); ) alert(str); ) ) - /SCRIPT /HEAD body style=text-align:center;margi
10、n: 0 auto;font-size: 12px; mce_style=text-align:center;margin: 0 auto;font-size: 12px; div style=border: 1px solid #999; width: 500px; padding: 15px; background: #eee; margin-top: 150px; form name=form1 method=post action= input type=button id=btn1 value=全选 input type=button id=btn2 value=取消全选 input
11、 type=button id=btn3 value=选中全部奇数 input type=button id=btn4 value=反选 input type=button id=btn5 value=获得选中的全部值 br /br / input type=checkbox name=checkbox value=checkbox1 checkbox1 input type=checkbox name=checkbox value=checkbox2 checkbox2 input type=checkbox name=checkbox value=checkbox3 checkbox3 input type=checkbox name=checkbox value=checkbox4 checkbox4 input type=checkbox name=checkbox value=checkbox5 checkbox5 input type=checkbox name=checkbox value=checkbox6 checkbox6 /form /div /body /HTML 以上这篇jquery猎取复选框的值的简洁实例就是我分享给大家的全部内容了，盼望能给大家一个参考 .