每当有多个选项的时候,都会有一种想法是:全选,全不选,如果子选项有被选,父选项也得被选。

注意:这里是根据id来获取元素的,但是不能直接用getElementById,因为那只能返回一个,而不是集合。

直接上代码:全选/全不选

function check_all(obj,id)
{
var elements = document.getElementsByName("chk[]");
var str = "" + elements.length;
for(i = 0;i < elements.length;i++)
{
if(elements[i].id == id)
elements[i].checked = obj.checked;
}
}
<input id="registBlock" name="block[]" onclick="check_all(this,'sub')" checked="" type="checkbox">
<label><input id="regist" name="chk[]" onclick="check_child(this,'sub')" value="1" checked="" type="checkbox">子模块1</label>
<label><input id="regist" name="chk[]" onclick="check_child(this,'sub')" value="2" checked="" type="checkbox">子模块2</label>

js之checkbox的代码全选/全不选,使用id获取元素,而不是name的更多相关文章

  1. js中用tagname和id获取元素的3种方法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. js操作checkbox(复选框)的方法总结

    收集了一些用js代码操作checkbox复选框的代码,分享出来,供需要的朋友参考: <script> //复选框checkbox 处理方法 //搜集整理 www.jbxue.com fun ...

  3. JS 获取元素、修改元素/css样式/标签属性、简单事件、数据类型

    基本使用 写在Script 标签里 引入外部js文件:<script src=" "></script> console.log(" " ...

  4. 原生JS与JQ获取元素的区别

    刚学JQ不久,有时候可能会把JS和JQ获取元素的方式搞错,接下来获取属性方法什么的就一发不可收拾了,现在把两者获取获取元素的代码整理下. 一.原生JS获取元素. 1.常用的三种方式获取元素对象(将指定 ...

  5. Vue.js实现checkbox的全选和反选

    小颖之前写的代码存在一个bug,就是当你选择全选的时候去掉后面的一个选项,再点全选结果就是反的了.很感谢博客园的朋友帮我改了这个问题嘻嘻,下面一起来看看具体是怎么实现的吧. 1.html <te ...

  6. Jquery全选与反选checkbox(代码示例)

    今天在公司要实现操作权限的功能,需要根据左边的树,选择一项,判断右边的操作权限,例如,增加,修改,删除,查看等按钮的显示与隐藏: 这个功能实现思路如下: 1.操作权限:增加.修改等按钮的ID和Text ...

  7. asp.net中Repeater结合js实现checkbox的全选/全不选

    前台界面代码: <input name="CheckAll" type="checkbox" id="CheckAll" value= ...

  8. JS checkbox 全选 全不选

    /* JS checkbox 全选 全不选 Html中checkbox: <input type="checkbox" name="cbx" value= ...

  9. js实现CheckBox全选或者不全选

    <html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">< ...

随机推荐

  1. Android学习笔记:adb 与 adb shell操作 以及中文乱码解决

    1.安装app >adb install xxx.apk 2.卸载app >adb uninstall app的包路径 如:>adb uninstall com.example.my ...

  2. maven仓库--私服(Nexus的配置使用)

    maven--私服的搭建(Nexus的使用)和注意的问题 私服是什么 私服,私有服务器,是公司内部Maven项目经常需要的东东,不总结一下,不足以体现出重视.Nexus是常用的私用Maven服务器,一 ...

  3. 关于初始化C++类成员

    在使用C++编程的过程当中,常常需要对类成员进行初始化,通常的方法有两种: 第一种方法: CMYClass::CSomeClass() { x=0; y=1; } 第二种方法: CSomeClass: ...

  4. nodejs--express开发个人博客(-)

    写完了入门笔记,开始进入开发阶段吧.基于上一节的内容,现在着手开发个人博客系统.先划分一下功能吧 /:首页 /login:登陆 /reg:注册 /post:发表文章 /logout:退出 首先规划一下 ...

  5. adxl345的STM32驱动程序和硬件设计

    一.硬件电路接口图片 1.ADXL345硬件接口图片使用的是SPI端口进行通信,这样读取数据比较快且后续也可以转化为IIC通信接口. 在网上找一些发现IIC接口的比较多,所以本人就DIY做SPI的通信 ...

  6. Linux 下IOport编程訪问

    曾经写的一篇笔记.偶尔翻出来了,放在这里做个纪念 Linux 下IOport编程訪问 这里记录的方法是在用户态訪问IOport,不涉及驱动程序的编写. 首先要包括头文件 /usr/include/as ...

  7. NGUI出现Shader wants normals, but the mesh UIAtlas doesn&#39;t have them

    NGUI出现Shader wants normals, but the mesh UIAtlas doesn't have them,没有网格法线,打开UI Root上 UIPanel组建上的 Nor ...

  8. 纠错记录(Could not open the editor: Android XML Editor cannot process this input.)

    Eclipse无法打开xml文件 preference->general->edit->file association->file types->选择.xml,然后在a ...

  9. ant学习记录(复制-移动-删除-依赖综合测试)+fileset

    <?xml version="1.0"?> <project name="targetStudy" default="mkdir&q ...

  10. Python 第八篇:异常处理、Socket语法、SocketServer实现多并发、进程和线程、线程锁、GIL、Event、信号量、进程间通讯

    本节内容: 异常处理.Socket语法.SocketServer实现多并发.进程和线程.线程锁.GIL.Event.信号量.进程间通讯.生产者消费者模型.队列Queue.multiprocess实例 ...