20140414-jquery操作复选框（checkbox）
20140414-jquery操作复选框（checkbox）
参考资料：
|
jquery操作复选框(checkbox)的12个小技巧总结_jquery_脚本之家 http://www.jb51.net/article/46469.htm JQuery对checkbox操作 （循环获取）_jquery_脚本之家 http://www.jb51.net/article/27186.htm |
我测试的代码：
|
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jQuery_01</title> <meta name="author" content="Administrator" /> <!-- Date: 2014-04-13 --> <script type="text/javascript" src="/D:/document/MyWorkSpaces/jQuery/js/jquery-1.8.3.js"></script> <script type="text/javascript"> $(function(){ // 全选 $("#btn1").click(function(){ $("input[name=‘checkbox‘]").attr("checked",true); });
// 取消全选 $("#btn2").click(function(){ //$("input[name=‘checkbox‘]").attr("checked",false); $("input[name=‘checkbox‘]").removeAttr("checked"); });
// 选中所有奇数 $("#btn3").click(function(){ //$("input[name=‘checkbox‘]:even").attr("checked","true"); $("input[name=‘checkbox‘]:even").attr("checked",true); });
// 选中所有偶数 $("#btn4").click(function(){ $("input[name=‘checkbox‘]:odd").attr("checked",true); });
// 反选 $("#btn5").click(function(){ $("input[name=‘checkbox‘]").each(function(){ if($(this).attr("checked")){ $(this).removeAttr("checked"); }else{ $(this).attr("checked",true); } }); });
// 获得选中的所有值 $("#btn6").click(function(){ var students=""; $("input[name=‘checkbox‘]:checkbox:checked").each(function(){ students=students+$(this).val()+"\t"; }); $("#info").html(students); }); }); </script> </head> <body>
<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="反选"> <input type="button" id="btn6" value="获得选中的所有值"><br/>
<input type="checkbox" name="checkbox" value="checkbox1">checkbox1<br/> <input type="checkbox" name="checkbox" value="checkbox2">checkbox2<br/> <input type="checkbox" name="checkbox" value="checkbox3">checkbox3<br/> <input type="checkbox" name="checkbox" value="checkbox4">checkbox4<br/> <input type="checkbox" name="checkbox" value="checkbox5">checkbox5<br/> <input type="checkbox" name="checkbox" value="checkbox6">checkbox6<br/> <input type="checkbox" name="checkbox" value="checkbox7">checkbox7<br/> <input type="checkbox" name="checkbox" value="checkbox8">checkbox8<br/>
<div id="info"></div>
</body> </html> |
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
