点滴积累【JS】---JS小功能(checkbox实现全选和全取消)
效果:


代码:
<head runat="server">
<title></title>
<script type="text/javascript">
window.onload = function () {
var ckall = document.getElementById('ck1');
var ck = document.getElementsByName('name1');
ckall.onclick = function () {
for (var i = 0; i < ck.length; i++) {
if (ckall.checked == true) {
ck[i].checked = true;
}
else {
ck[i].checked = false;
}
}
}
};
</script>
</head>
<body>
<form id="form1" runat="server">
<input type="checkbox" id="ck1" />
全选
<div id="div1">
<input type="checkbox" name="name1" />
<input type="checkbox" name="name1" />
<input type="checkbox" name="name1" />
<input type="checkbox" name="name1" />
<input type="checkbox" name="name1" />
<input type="checkbox" name="name1" />
</div>
</form>
</body>
点滴积累【JS】---JS小功能(checkbox实现全选和全取消)的更多相关文章
- JS小案例--全选和全不选列表功能的实现
纯js代码实现列表全选和全不选的功能 <!DOCTYPE html> <html> <head lang="en"> <meta char ...
- 使用js实现全选功能。(全选,全不选,反选)
作业210721 提交代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...
- js实现复选框的全选、全不选、反选
js中实现复选框的全选,全不选以及反选,分为两种情况: (1)选中“请选择”前面的复选框实现全选,不选中“请选择”前面的复选框实现全不选 <!DOCTYPE html PUBLIC " ...
- js实现复选框的全选、全不选和反选
js实现复选框的全选.全不选和反选 主要是用遍历的方法查找元素,然后通过改变checked的属性来选择,为true则是选中状态,为false则是未选状态 实现代码 <!DOCTYPE html& ...
- js 判断 复选框全选、全不选、反选、必选一个
一个挺 使用的 js 代码片段, 判断 复选框全选.全不选.反选.必选一个 记录下, 搬来的 思路: 修改数据的 选中与否状态, 拿到所有的输入框,看是否有选中的状态 <html> & ...
- js复选框实现全选、全不选、反选
复选框为checkbox对象 通过input就可以将一个简单的复选框呈现在页面上 <input type="checkbox" /> 要实现的大概就是这样一个页面 思路 ...
- 全选,全不选,反选的js实现
全选练习 ** 使用复选框上面一个属性判断是否选中 - checked属性 - checked=true:选中 ...
- JS案例五:设置全选、全不选以及反选
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JS练习:表格全选与全不选
代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title ...
- JavaScript学习——使用JS完成全选和全不选操作
1.我们希望在后台系统实现一个批量删除的操作(全选所有的复选框)和全不选,显示效果如下: 2.步骤分析: 第一步:确定事件(onclick)并为其绑定一个函数(事件绑定到编号前面的复选框里面) 第二步 ...
随机推荐
- openstack-cinder-netapp
https://communities.netapp.com/docs/DOC-31749 http://docs.openstack.org/havana/config-reference/cont ...
- rocketmq,zookeeper,redis分别持久化的方式
1.rocketmq持久化: RocketMQ 的所有消息都是持久化的, 先写入系统 PAGECACHE, 然后刷盘, 可以保证内存与磁盘都有一份数据,访问时,直接从内存读取. RocketMQ 的所 ...
- FORM - FILE.EXPORT 导出功能
对于数据块项,是不用添加任何触发器就可以使用导出功能的. 如果不能使用该功能,可能是由于在需要使用导出功能的块上添加了block级触发器when-new-item-instance,但执行层次为&qu ...
- 关于使用Android新版Camera即Camera2的使用介绍 暨解决Camera.PreviewCallback和MediaRecorder无法同时进行
新的相机API也就是Camera2是在Android 5.0引进的.通常情况下,我们都是使用Android旧的相机API,纵然在Android Studio里老是提示已经废弃,但是只要都能用,也就没必 ...
- [java] 模拟QPS
在WEB服务器端,每日的访问量巨大.在非生产环境需要对服务器进行压力测试,一般使用后台线程和Sleep方式来模拟线上的压力.这里使用ScheduledExecutorService实现一种简单的QPS ...
- asp.net membership 修改密码
aspnet_Applications 存储数据库所涉及应用程序有关信息. aspnet_Membership 存储与用户相关信息例如:用户登陆密码,创建时间. aspnet_Paths 存储应用程序 ...
- 二十四种设计模式:单例模式(Singleton Pattern)
单例模式(Singleton Pattern) 介绍保证一个类仅有一个实例,并提供一个访问它的全局访问点. 示例保证一个类仅有一个实例. Singleton using System; using S ...
- AQTime教程
1 简介 AQTime和MemProof都是AutomatedQA旗下的产品,AQTime比MemProof提供了更丰富强大的功能.该产品含有完整的性能和调试工具集,能够收集程序运行时关键的性能信息和 ...
- Python程序员技能表—446家知名企业的Py招聘信息(转载)
Python程序员技能表—446家知名企业的Py招聘信息 转载: python 正在学习python或者想学习python的可以加群:330637182 正在学习python或者想学习python的可 ...
- 隐藏系统EFI分区Z盘
找到C:\Windows\System32\cmd.exe程序, 右键单击cmd 选择以管理员身份运行, 打开命令提示符,输入以下命令(不区分大小写)DiskPart回车List空格volume回车s ...