jquery实现复选框全选反选
实现原理:
给所有的复选框取相同的名字,当点击全选的时候把chenked属性全部设置为true;当点击全不选的时候把checked属性设置为false;
源代码如下:
html代码:
<form method="post" action=""> 你的爱好是:<input type="checkbox" id="CheckedAll" />全选/全不选 <br /> <input type="checkbox" name="one" value="唱歌" />唱歌 <input type="checkbox" name="one" value="跳舞" />跳舞 <input type="checkbox" name="one" value="看书" />看书 <input type="checkbox" name="one" value="运动" />运动 <br /> <input type="button" id="send" value="提交" /> </form>
js代码:
<script type="text/javascript"> $(document).ready(function(){ $("#CheckedAll").click(function(){ if (this.checked){ $("[name=one]:checkbox").attr("checked",true); }else{ $("[name=one]:checkbox").attr("checked",false); } /* $("[name=checkboxt]:checkbox").attr("checked",this.checked);*/ }); $("#send").click(function(){ var str ="你的爱好是:\r\n"; $("[name=one]:checkbox:checked").each(function(){ str+=$(this).val()+"\r\n"; }); alert(str); }); }); </script>