//获取单选按钮的选项值 function f1() { //radio集合 var radios = document.getElementsByName("sex"); for (var i = 0; i < radios.length; i++) { if (radios[i].checked) { alert(radios[i].value); break; } } } <input type="checkbox" id="chkAll" id="btn" type="button" value="反选" /><br /> <input id="childChk1" type="checkbox" value="cf"/>吃饭<br/> <input id="Checkbox2" type="checkbox" value="sj"/>睡觉<br/> <input id="Checkbox3" type="checkbox" value="dq"/>打球<br/> //复选框的全选功能 function checkAll() { //触发事件对象,全选的checkbox var obj = event.srcElement; //所有的input标签 var inputs = document.getElementsByTagName("input"); for (var i = 0; i < inputs.length; i++) { //判断当前的对象是不是input对象,是不是checkbox if (inputs[i].type == "checkbox") { inputs[i].checked = obj.checked; } } } //给所有的 子checkbox注册事件,如果所有的子checkbox都打勾了,则全选也打勾 window.onload = function () { var inputs = document.getElementsByTagName("input"); for (var i = 0; i < inputs.length; i++) { if (inputs[i].type == "checkbox") { //去掉全选的那个chexkbox if (inputs[i].id != "chkAll") { //给每个子checkbox注册事件 inputs[i].onclick = function () { //判断子checkbox是不是被选中了 //假设所有的都被选中 var isCheckAll = true; for (var j = 0; j < inputs.length; j++) { if (inputs[j].type == "checkbox" && inputs[j].id != "chkAll") { //判断子的checkbox是否被选中 if (!inputs[j].checked) { isCheckAll = false; break; } } } //设置全选状态 document.getElementById("chkAll").checked = isCheckAll; } } } } }
js控制单选复选框(全选)
发布日期:2021-10-26 12:56:53
浏览次数:1
分类:技术文章
本文共 1413 字,大约阅读时间需要 4 分钟。
转载于:https://blog.51cto.com/dingxiaowei/1366609
转载地址:https://blog.csdn.net/weixin_33782386/article/details/92500427 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!
发表评论
最新留言
逛到本站,mark一下
[***.202.152.39]2024年03月10日 09时25分46秒
关于作者
喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!
推荐文章
mysql5.7中文匹配度 match_深度解析MySQL 5.7之中文全文检索
2019-04-21
node mysql 事件循环_nodejs的事件循环简单理解
2019-04-21
java post返回值乱码_java post请求乱码解决方法
2019-04-21
java开源物联网_JetLinks开源物联网平台源码 v1.8.0
2019-04-21
java小猿_猿辅导笔试第二题(Java版)-小猿抽奖
2019-04-21
import java.io后报错_大神求解,IO报错文件名、目录名或卷标语法不正确
2019-04-21
给图片加上水印php视频,php给图片添加水印的实现过程
2019-04-21
php计算时间差js,js 求时间差怎么求实例代码
2019-04-21
php 分布式锁,php 实现Redis分布式锁
2019-04-21
php 替换表情符号,php – 表情符号用“<3”替换数组
2019-04-21
PHP程序中时间戳,PHP 时间戳 与 时间
2019-04-21
php groovy,编程语言Groovy重新崛起
2019-04-21
拆分订单php,订单拆分成子订单问题求教
2019-04-21
php模拟测试,使用模拟进行单元测试(PHP)
2019-04-21
php workerman怎么样,workerman怎样完成高并发_PHP开发框架教程
2019-04-21