js函数

复制代码
代码如下:
<script type="text/javascript">

function checkAll(name) {
var el =
document.getElementsByTagName('input');
var len = el.length;
for(var
i=0; i<len; i++) {
if((el[i].type=="checkbox") &&
(el[i].name==name)) {
el[i].checked = true;
}
}
}
function
clearAll(name) {
var el = document.getElementsByTagName('input');
var
len = el.length;
for(var i=0; i<len; i++) {

if((el[i].type=="checkbox") && (el[i].name==name)) {

el[i].checked = false;
}
}
}
</script>

html

复制代码
代码如下:
<input type="checkbox" name="test"
value="" onclick="if(this.checked==true) { checkAll('test'); } else {
clearAll('test'); }" /> 字母全选开关
<input type="checkbox" name="test"
value="a" /> a
<input type="checkbox" name="test" value="b" /> b

<input type="checkbox" name="test" value="c" /> c
<input
type="checkbox" name="test" value="d" /> d
<input type="checkbox"
name="test" value="e" /> e
<input type="checkbox" name="test"
value="f" /> f
<input type="checkbox" name="test" value="g" /> g

<br />
<input type="checkbox" name="num" value=""
onclick="if(this.checked==true) { checkAll('num'); } else { clearAll('num'); }"
/> 数字全选开关 <input type="checkbox" name="num" value="1" /> 1

<input type="checkbox" name="num" value="2" /> 2
<input
type="checkbox" name="num" value="3" /> 3
<br />
<br />

<input type="button" value="选择所有的字母" onclick="checkAll('test')" />
<input type="button" value="清空选中的字母" onclick="clearAll('test')" /> <br
/>
<br />
<input type="button" value="选择所有的数字"
onclick="checkAll('num')" /> <input type="button" value="清空选中的数字"
onclick="clearAll('num')" /> 

Javascript实现CheckBox的全选与取消全选的代码(转)的更多相关文章

  1. bootstrap实现checkbox全选、取消全选

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <!-- 最新版本的 ...

  2. JS对checkbox全选和取消全选

    需求:checkbox控制列表数据全选与取消全选择. 效果图: 1.html <body > <input type="button" name="in ...

  3. CheckBox全选、取消全选

    关于CheckBox全选取消全选 //全选 $("#SysAllSelectedID").click(function () { $("[name=SysCheckbox ...

  4. jQuery --checkbox全选和取消全选简洁高效的解决办法

    最近在公司做了一个小项目,其中有一个全选和取消全选的这么一个模块,搞了半天找不到一种最佳的解决方案!后来通过各种努力找到了一种简洁高效的解决办法,这里想和大家分享一下.有问题的话,还望各路大神指导一二 ...

  5. js实现checkbox组 全选和取消全选

    做后台管理程序时,用到一个checkbox组的全选和取消全选的功能, 主要是逻辑上的坑,理清后大概是: 1.全选点击后,小弟1~4都要选上,点击取消,小弟们也要取消 2.只要有一个小弟取消时,全选要取 ...

  6. datagridview里面的checkbox全选和取消全选

    全选 设置全选button,选中所有的checkbox private void selectAll_Click(object sender, EventArgs e) { //遍历datagridv ...

  7. jquery购物车全选,取消全选,计算总金额

    这是html代码 <div class="gwcxqbj"> <div class="gwcxd center"> <div cl ...

  8. 使用AngularJS实现简单:全选和取消全选功能

    这里用到AngularJS四大特性之二----双向数据绑定 注意:没写一行DOM代码!这就是ng的优点,bootstrap.css为了布局,JS代码也只是简单创建ng模块和ng控制器 效果: < ...

  9. react实现全选、取消全选和个别选择

    react里面实现全选和取消全选,个别选择等操作,效果如下 代码: import React, {Component} from 'react' export default class Demo e ...

  10. js全选与取消全选

    实现全选与取消全选的效果 要求1(将军影响士兵):点击全选按钮,下面的复选框全部选中,取消全选按钮,下面的复选框全部取消 思路:复选框是否被选中,取决于check属性,将全选按钮的check属性值赋值 ...

随机推荐

  1. 配置DNS服务器

    一.配置基本的DNS 服务器(包含正向解析和反向解析)域名:abc.com服务器IP:10.1.2.11 1. 编辑主配置文件/etc/named.conf---------------------- ...

  2. iOS 开发笔记-AFNetWorking https SSL认证

    一般来讲如果app用了web service , 我们需要防止数据嗅探来保证数据安全.通常的做法是用ssl来连接以防止数据抓包和嗅探 其实这么做的话还是不够的 . 我们还需要防止中间人攻击(不明白的自 ...

  3. JS中iframe相关的window.self,window.parent,window.top

    window.self指的是当前窗口:他等价于window,self,window.self window.top指的是最顶层的窗口(有些页面可能会嵌套好几个iframe)如果只有一个窗口,那么就返回 ...

  4. php常用函数汇总

    php常用函数汇总   字符串截取:           1.substr('要截取的字符串','从第几个字符开始','到第几个字符结束');             * 截取英文或者数字       ...

  5. [问题2014A10] 解答

    [问题2014A10]  解答 考虑如下变形: \[(I_n-A)^2=(AA'-A)(I_n-A)=A(A'-I_n)(I_n-A)=-A(I_n-A)'(I_n-A).\] 因为 \(A\) 是非 ...

  6. ASP.NET MVC view引入命名空间

    两种方式:1,在cshtml中引入@using Admin.Models 2,在 Views 文件夹中的 Web.config 文件中添加引用如: <pages pageBaseType=&qu ...

  7. ios设备相关

    设备方向 typedef NS_OPTIONS(NSUInteger, UIInterfaceOrientationMask) { UIInterfaceOrientationMaskPortrait ...

  8. 小白菜初探nodejs

    记得大四那年实习的时候出去找工作,就常常听见大家说node.从那以后,悄然埋下了一颗学习nodejs的心.不过由于基础太薄弱,一直没有学习.加之工作上没有相关应用,就一直搁置到现在. 年会的时候,老大 ...

  9. Windows Internals学习笔记(七)Image Loader

    参考资料: 1. <Windows Internals> 2. Fibers 知识点: ● 当一个进程在系统上启动时,内核将创建一个进程对象来代表它,并执行各种内核相关的初始化任务.然而, ...

  10. [bzoj1103][POI2007]大都市meg(树状数组+dfs序)

    1103: [POI2007]大都市meg Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 2031  Solved: 1069[Submit][Sta ...