jquery猎取复选框的值的简洁实例_.docx
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" 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()" 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(obji.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的其他几个操作 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);/选中全部奇数 ) $("#btn4").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代码： !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:/leotheme.cn/wp-includes/js/jquery/jquery.js" mce_src="http:/leotheme.cn/wp-includes/js/jquery/jquery.js"/mce:script SCRIPT LANGUAGE="JavaScript" !- $("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(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); ) ) - /SCRIPT /HEAD body style="text-align:center;margin: 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 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猎取复选框的值的简洁实例就是我分享给大家的全部内容了，盼望能给大家一个参考 .
