<div class="codetitle"> <span><a style="CURSOR: pointer" data="37669" class="copybut" id="copybut37669" onclick="doCopy('code37669')"><u>复制代码</u></a></span> 代码如下:</div> <div class="codebody" id="code37669"> <br> <br> <br> <br><style><!-- <BR>--></style> <style mce_bogus="1"> <br><br></style> <br><title>JS获取复选框被选中的值</title> <br> <br> <br><input type="checkbox" name="test" value="0">0 <br><input type="checkbox" name="test" value="1">1 <br><input type="checkbox" name="test" value="2">2 <br><input type="checkbox" name="test" value="3">3 <br><input type="checkbox" name="test" value="4">4 <br><input type="checkbox" name="test" value="5">5 <br><input type="checkbox" name="test" value="6">6 <br><input type="checkbox" name="test" value="7">7 <br><input type="button" onclick="chk()" value="提 交"> <br> <br><br> </div> <br>JS代码 <br><div class="codetitle"> <span><a style="CURSOR: pointer" data="29383" class="copybut" id="copybut29383" onclick="doCopy('code29383')"><u>复制代码</u></a></span> 代码如下:</div> <div class="codebody" id="code29383"> <br><script src="jquery.js" mce_src="jquery.js"></script><!--这是载入jquery.js文件,如果不使用jquery可以去掉--> <br><script type="text/javascript"><!-- <br><br>function chk(){ <BR>var obj=document.getElementsByName('test'); //选择所有name="'test'"的对象,返回数组 <BR>//取到对象数组后,我们来循环检测它是不是被选中 <BR>var s=''; <BR>for(var i=0; i<obj.length; i++){ <BR>if(obj[i].checked) s+=obj[i].value+','; //如果选中,将value添加到变量s中 <BR>} <BR>//那么现在来检测s的值就知道选中的复选框的值了 <BR>alert(s==''?'你还没有选择任何内容!':s); <BR>} <br><br>function jqchk(){ //jquery获取复选框值 <BR>var chk_value =[]; <BR>$('input[name="test"]:checked').each(function(){ <BR>chk_value.push($(this).val()); <BR>}); <BR>alert(chk_value.length==0 ?'你还没有选择任何内容!':chk_value); <BR>} <BR>// --></script> <br> </div> <br>对checkbox的其他几个操作 <br><br>1. 全选 <br>2. 取消全选 <br>3. 选中所有奇数 <br>4. 反选 <br>5. 获得选中的所有值 <br><br>js代码 <br><div class="codetitle"> <span><a style="CURSOR: pointer" data="7356" class="copybut" id="copybut7356" onclick="doCopy('code7356')"><u>复制代码</u></a></span> 代码如下:</div> <div class="codebody" id="code7356"> <br><br>$("document").ready(function(){ <br>$("#btn1").click(function(){ <br>$("[name='checkbox']").attr("checked",'true');//全选 <br>}) <br>$("#btn2").click(function(){ <br>$("[name='checkbox']").removeAttr("checked");//取消全选 <br>}) <br>$("#btn3").click(function(){ <br>$("[name='checkbox']:even").attr("checked",'true');//选中所有奇数 <br>}) <br>$("#btn4").click(function(){ <br>$("[name='checkbox']").each(function(){//反选 <br>if($(this).attr("checked")){ <br>$(this).removeAttr("checked"); <br>} <br>else{ <br>$(this).attr("checked",'true'); <br>} <br>}) <br>}) <br>$("#btn5").click(function(){//输出选中的值 <br>var str=""; <br>$("[name='checkbox'][checked]").each(function(){ <br>str+=$(this).val()+"/r/n"; <br>//alert($(this).val()); <br>}) <br>alert(str); <br>}) <br>}) <br> </div> <br>html代码: <br><div class="codetitle"> <span><a style="CURSOR: pointer" data="46877" class="copybut" id="copybut46877" onclick="doCopy('code46877')"><u>复制代码</u></a></span> 代码如下:</div> <div class="codebody" id="code46877"> <br> <br> <br> <br><meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <br><title>louis-blog >> jQuery 对checkbox的操作</title> <br><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"></script> <br><script language="JavaScript"> <BR><!-- <BR>$("document").ready(function(){ <BR>$("#btn1").click(function(){ <BR>$("[name='checkbox']").attr("checked",'true');//全选 <BR>}) <BR>$("#btn2").click(function(){ <BR>$("[name='checkbox']").removeAttr("checked");//取消全选 <BR>}) <BR>$("#btn3").click(function(){ <BR>$("[name='checkbox']:even").attr("checked",'true');//选中所有奇数 <BR>}) <BR>$("#btn4").click(function(){ <BR>$("[name='checkbox']").each(function(){//反选 <BR>if($(this).attr("checked")){ <BR>$(this).removeAttr("checked"); <BR>} <BR>else{ <BR>$(this).attr("checked",'true'); <BR>} <BR>}) <BR>}) <BR>$("#btn5").click(function(){//输出选中的值 <BR>var str=""; <BR>$("[name='checkbox'][checked]").each(function(){ <BR>str+=$(this).val()+"/r/n"; <BR>//alert($(this).val()); <BR>}) <BR>alert(str); <BR>}) <BR>}) <BR>--> <BR></script> <br> <br> <br><div style="border: 1px solid #999; width: 500px; padding: 15px; background: #eee; margin-top: 150px;"> <br><form name="form1" method="post" action=""> <br><input type="button" id="btn1" value="全选"> <br><input type="button" id="btn2" value="取消全选"> <br><input type="button" id="btn3" value="选中所有奇数"> <br><input type="button" id="btn4" value="反选"> <br><input type="button" id="btn5" value="获得选中的所有值"> <br><br><br> <br><input type="checkbox" name="checkbox" value="checkbox1"> <br>checkbox1 <br><input type="checkbox" name="checkbox" value="checkbox2"> <br>checkbox2 <br><input type="checkbox" name="checkbox" value="checkbox3"> <br>checkbox3 <br><input type="checkbox" name="checkbox" value="checkbox4"> <br>checkbox4 <br><input type="checkbox" name="checkbox" value="checkbox5"> <br>checkbox5 <br><input type="checkbox" name="checkbox" value="checkbox6"> <br>checkbox6 <br> </form> <br> </div> <br> <br> <br> </div>