博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
利用jQuery实现全选、全不选、反选(checkBox)
阅读量:6610 次
发布时间:2019-06-24

本文共 722 字,大约阅读时间需要 2 分钟。

<!DOCTYPE html>

<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="jquery-1.8.3.js"></script>
</head>
<body>
<input type="checkBox" class="all">全选/全不选
<br>
<input type="checkBox" class="un">反选
<hr>
<div id="main">
<input type="checkBox">篮球
<br>
<input type="checkBox">羽毛球
<br>
<input type="checkBox">乒乓球
<br>
<input type="checkBox">足球
<br>
<input type="checkBox">橄榄球
<br>
<input type="checkBox">棒球
</div>
</body>
<script type="text/javascript">
// 全选和全不选举
$('.all').click(function(){
$('#main input').attr('checked',this.checked);
});
// 反选
$('.un').click(function(){
$('#main input').each(function(){
this.checked=!this.checked; // 进行反选
});

});

</script>
</html>

转载于:https://blog.51cto.com/11871779/2069578

你可能感兴趣的文章
【转】UIColor对颜色的自定义
查看>>
php编译报错 configure: error: Please reinstall the libcurl distribution - easy.h should be in <curl-...
查看>>
asp.net后台进程做定时任务
查看>>
Ural_1671. Anansi's Cobweb(并查集)
查看>>
Web墨卡托坐标与WGS84坐标互转
查看>>
给vs2012换肤
查看>>
java接口中多继承的问题
查看>>
索引笔记《二》确定需要建立索引的列
查看>>
libjpeg的问题
查看>>
MySQL数据库学习笔记(八)----JDBC入门及简单增删改数据库的操作
查看>>
Java Web之Filter
查看>>
HTTP状态码详解
查看>>
Java_动态加载
查看>>
atitti.atiNav 手机导航组件的设计
查看>>
Ubuntu+Apache+PHP+Mysql环境搭建(完整版)
查看>>
Atitit.计算机图形图像图片处理原理与概论attilax总结
查看>>
于ssh端口转发的深入实例[转 - 当当 - 51CTO技术博客
查看>>
从Python安装到语法基础,这才是初学者都能懂的爬虫教程 ...
查看>>
超级AD远程管理软件
查看>>
Oracle数据库安全加固记录
查看>>