原生js实现选中所有的checkbox
<div class="con">
<input name='多选项名称' type='checkbox' value='' id="all" onclick="cli('cc');"> 全选
<input name='cc' type='checkbox' value='' > A
<input name='cc' type='checkbox' value='' > B
<input name='cc' type='checkbox' value='' > C
<input name='cc' type='checkbox' value='' > D
<input name='cc' type='checkbox' value='' > E
<input name='cc' type='checkbox' value='' > F
</div> <script type="text/javascript">
function cli (obj) {
let chill = document.getElementById('all')
let chilles = document.getElementsByName(obj)
if (chill.checked) {
for (let i = 0; i < chilles.length; i++) {
chilles[i].checked = true
}
} else {
for (let i = 0; i < chilles.length; i++) {
chilles[i].checked = false
}
}
}
原生js实现选中所有的checkbox。需要给所有的input标签写上专属的name。getElementsByName() 方法可返回带有指定名称的对象的集合。查询元素的 name 属性。
原生js实现选中所有的checkbox的更多相关文章
- 原生JS实现选中的radio变为未选中
需求如下,radio已经选中,再点击,取消选中状态. 效果如链接:演示地址 直接上代码: <!DOCTYPE html> <html> <head> <met ...
- 原生js获取页面中所有checkbox
var inputs = document.getElementsByTagName("input");//获取所有的input标签对象 var checkboxArray = [ ...
- 原生js获取页面所有的checkbox
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;
折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;
- JS 如何获取radio或者checkbox选中后的值
废话不多说,直接上代码: 代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...
- 原生html、js手写 radio与checkbox 美化
原生html.js手写 radio与checkbox 美化 html <!DOCTYPE html> <html> <head> <meta charse ...
- 原生JS实现购物车结算功能代码+zepto版
html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...
- jquery选中radio或checkbox的正确姿势
jquery选中radio或checkbox的正确姿势 Intro 前几天突然遇到一个问题,没有任何征兆的..,jquery 选中radio button单选框时,一直没有办法选中,后来查了许多资料, ...
- 利用原生js制做数据管理平台,适合初学者学习
摘要:数据管理平台在当今社会中运用十分广泛,我们在应用过程中,要对数据进行存储,管理,以及删除查询等操作,而我们在实际设计的时候,大牛们大多用到的是JQuery,而小白对jq理解也较困难,为了让大家回 ...
随机推荐
- 处理并解决mysql8.0 caching-sha2-password问题,开启远程访问
原文:https://blog.csdn.net/u010026255/article/details/80062153 启动mysql服务:service mysqld start ALTER US ...
- 走进Github的世界
1.官网注册账号 2.官网向导: https://guides.github.com/activities/hello-world/ 值得推荐: Git手册: https://git-scm.com/ ...
- k8s命令自动补全
Linux yum install -y bash-completion source /usr/share/bash-completion/bash_completion source <(k ...
- JAVA 获取类名,函数名
获取以下获取方法所在函数的相关信息 1.获取当前函数名:Thread.currentThread().getStackTrace()[1].getMethodName(); 2.获取当前类名:Thre ...
- 静态库lib、动态库dll基础
首先从hello world!开始 //main.cpp文件 void cpu(); int main() { put(); ; } 在main.cpp中定义了一个cpu():函数,但没有实现其功能, ...
- 如何开始使用 Akka
如果你是第一次开始使用 Akka,我们推荐你先运行简单的 Hello World 项目.情况参考 Quickstart Guide 页面中的内容来下载和运行 Hello World 示例程序.上面链 ...
- [CSP-S模拟测试]:打表(猜测题意+结论)
题目传送门(内部题139) 输入格式 第一行两个整数$k,ans$,表示内存地址$A$的位数,以及答案所在的内存地址. 接下来一行$2^k$个整数,分别表示内存地址$0...2^k-1$上的值. 输出 ...
- Java常考面试题整理(五)
81.RMI中的远程接口(Remote Interface)扮演了什么样的角色? 参考答案: 远程接口用来标识哪些方法是可以被非本地虚拟机调用的接口.远程对象必须要直接或者是间接实现远程接口.实现了远 ...
- 【转】Diamond -- 分布式配置中心
特别提示:本人博客部分有参考网络其他博客,但均是本人亲手编写过并验证通过.如发现博客有错误,请及时提出以免误导其他人,谢谢!欢迎转载,但记得标明文章出处:http://www.cnblogs.com/ ...
- nodejs 配置服务器
node 是 js 的运行的后台环境,他自身集成了很多模块,集成的模块直接 require 就行了: npm 第三方平台,他也是为 node 服务的,对于 npm 中的模块,先 npm install ...