checked多选,取消,反选
2024-10-21 05:47:26
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div>
<input type="button" value="全选" ondblclick="ChooseAll();">
<input type="button" value="取消" ondblclick="CancelAll();">
<input type="button" value="反选" ondblclick="TrunAll();">
</div>
<div>
<table>
<thead>
<tr>
<th>序号</th>
<th>用户</th>
<th>年龄</th>
</tr>
</thead>
<tbody id="c1">
<tr >
<td ><input class="i1" type="checkbox"/></td>
<td>alex</td>
<td>18</td>
</tr>
<tr>
<td ><input class="i1" type="checkbox"/></td>
<td>alex</td>
<td>18</td>
</tr>
<tr >
<td ><input class="i1" type="checkbox"/></td>
<td>alex</td>
<td>18</td>
</tr>
</tbody>
</table>
</div>
<script>
function ChooseAll() {
var td= document.getElementById('c1');
var doc = td.getElementsByClassName('i1');
for(var i=0;i<doc.length;i++){
var current = doc[i];
current.checked = true;
}
}
function CancelAll() {
var td= document.getElementById('c1');
var doc = td.getElementsByClassName('i1');
for(var i=0;i<doc.length;i++) {
var current = doc[i];
current.checked = false;
}
}
function TrunAll() {
var td= document.getElementById('c1');
var doc = td.getElementsByClassName('i1');
for(var i=0;i<doc.length;i++) {
var current = doc[i];
if (current.checked){
current.checked = false;
}else {
current.checked = true;
}
}
}
</script>
</body>
</html>
最新文章
- poj 3661 Running
- Ubuntu 安装 Xfce4 桌面
- paip.提升性能---mysql 优化cpu多核以及lan性能的关系.
- js打印Iframe中的内容，并且不需要预览。
- 七天学会SALTSTACK自动化运维 (3)
- Linux Shell脚本入门－－（linux空设备文件和重定向）>/dev/null 2>&1
- web学习总结之布局
- 类图class的依赖关系
- Design Pattern——开放封闭原则
- HTML5学习笔记四：html5结构
- 用于Mysql操作的MySqlHelper类
- java swing中Timer类的学习
- tomcat部署服务乱码问题
- pip "Cannot uninstall 'six'. It is a distutils installed project..." 解决方法
- 2018-2019-2 20165234 《网络对抗技术》 Exp2 后门原理与实践
- Android系统文件目录路径说明
- windows下配置host不生效问题
- windows 允许空密码登陆
- java并发：CAS算法和ABA问题
- 1926: [Sdoi2010]粟粟的书架