jquery实现的全选反选全不选等等的效果源码

最新推荐文章于 2022-04-01 12:35:29 发布

wuxieprobe

最新推荐文章于 2022-04-01 12:35:29 发布

阅读量1.4k

点赞数

分类专栏： javascript 我的收藏我的原创工作积累文章标签： jquery function input button xhtml action

本文链接：https://blog.youkuaiyun.com/gayayang/article/details/7741413

版权

我的收藏同时被 3 个专栏收录

162 篇文章

订阅专栏

每日成长

114 篇文章

订阅专栏

工作积累

113 篇文章

订阅专栏

test.html:(下载测试的话是必须配置下jquery的文件的。即是： <script src="jquery-1.3.2.js" type="text/javascript"></script>
这个语句需要修改)







<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gbk" /><title></title> <!--
 引入jQuery --> <script src="jquery-1.3.2.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ //全选 $("#CheckedAll").click(function(){ $('[name=items]:checkbox').attr('checked', true); }); //全不选 $("#CheckedNo").click(function(){
 $('[type=checkbox]:checkbox').attr('checked', false); }); //反选 $("#CheckedRev").click(function(){ $('[name=items]:checkbox').each(function(){ //$(this).attr("checked", !$(this).attr("checked")); this.checked=!this.checked; }); }); $("#send").click(function(){
 var str="你选中的是：\r\n"; $('[name=items]:checkbox:checked').each(function(){ str+=$(this).val()+"\r\n"; }) alert(str); }); }) </script></head><body><form method="post" action=""> 你爱好的运动是？ <br/> <input type="checkbox" name="items" value="足球"/>足球 <input type="checkbox"
 name="items" value="篮球"/>篮球 <input type="checkbox" name="items" value="羽毛球"/>羽毛球 <input type="checkbox" name="items" value="乒乓球"/>乒乓球 <br/> <input type="button" id="CheckedAll" value="全　选"/> <input type="button" id="CheckedNo" value="全不选"/> <input type="button"
 id="CheckedRev" value="反　选"/> <input type="button" id="send" value="提　交"/></form></body></html>