<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
function selectAll(num){
//获取下面的四个复选框
var res = document.getElementsByClassName("itemSelect");
for(var i=0;i<res.length;i++){
res[i].checked=num.checked;
}
}
</script>
</head>
<body>
<table id="tab1" border="1" width="800" align="center" >
<tr>
<td colspan="5"><input type="button" value="添加"/> <input type="button" value="删除"></td>
</tr>
<tr>
<th><input type="checkbox" onclick="selectAll(this)" id="ab"></th>
<th>分类ID</th>
<th>分类名称</th>
<th>分类描述</th>
<th>操作</th>
</tr>
<tr>
<td><input type="checkbox" class="itemSelect"></td>
<td>1</td>
<td>手机数码</td>
<td>手机数码类商品</td>
<td><a href="">修改</a>|<a href="">删除</a></td>
</tr>
<tr>
<td><input type="checkbox" class="itemSelect"></td>
<td>2</td>
<td>电脑办公</td>
<td>电脑办公类商品</td>
<td><a href="">修改</a>|<a href="">删除</a></td>
</tr>
<tr>
<td><input type="checkbox" class="itemSelect"></td>
<td>3</td>
<td>鞋靴箱包</td>
<td>鞋靴箱包类商品</td>
<td><a href="">修改</a>|<a href="">删除</a></td>
</tr>
<tr>
<td><input type="checkbox" class="itemSelect"></td>
<td>4</td>
<td>家居饰品</td>
<td>家居饰品类商品</td>
<td><a href="">修改</a>|<a href="">删除</a></td>
</tr>
</table>
</body>
</html>

JavaScript实现全选和全不选的更多相关文章

  1. JavaScript小例子：复选框全选

    JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...

  2. 表单javascript checkbox全选 反选 全不选

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  3. 【JavaScript】实现复选框的全选、全部不选、反选

    以较为简洁的程序实现复选框的全选.全部不选.反选 操作. 并且将可变的部分设置为JS的参数,以实现代码复用. 全选和全不选 第一个参数为复选框名称,第二个参数为是全选还是全部不选. function ...

  4. JavaScript学习——使用JS完成全选和全不选操作

    1.我们希望在后台系统实现一个批量删除的操作(全选所有的复选框)和全不选,显示效果如下: 2.步骤分析: 第一步:确定事件(onclick)并为其绑定一个函数(事件绑定到编号前面的复选框里面) 第二步 ...

  5. js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中

    <!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...

  6. CheckBox复选框全选以及获取值

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  7. 全选，全不选，反选的js实现

    全选练习       ** 使用复选框上面一个属性判断是否选中                   - checked属性                   - checked=true:选中    ...

  8. html table之 全选，全不选

    就是这个小功能让我和组长引发争端,就是这个小功能让我差点"被"辞职,就是这个自封装的js方法让我放下了对组长的敬畏之心,现在分享一下,其实也很简单,但是真的有这么简单吗? < ...

  9. 纯JavaScripst的全选、全不选、反选 【转】

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

  10. 复选框全选、全不选和反选的效果实现VIEW:1592

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

随机推荐

  1. 一.CPU,Mem过高怎么办 --这是个开始

    本身是名Java开发,在做了一段大数据的工作后,猛然间想对Java做个总结. 从未写过技术博客,一时不知如何开始,思虑后,暂且以自己喜爱的方式来开篇. 工作中遇到过CPU或内存过高的问题,解决步骤: ...

  2. 关于bootstrap的一些想法

    老实说,作为一个前端人员,我不怎么会去用bootstrap,但是我会去看,会去了解. 首先,bootstrap其实是给后台以及前端新人用来快速完成一个页面的简单布局,不是按照设计稿psd格式给定做的那 ...

  3. 再起航，我的学习笔记之JavaScript设计模式03

    我的学习笔记是根据我的学习情况来定期更新的,预计2-3天更新一章,主要是给大家分享一下,我所学到的知识,如果有什么错误请在评论中指点出来,我一定虚心接受,那么废话不多说开始我们今天的学习分享吧! 上一 ...

  4. C++基本内置类型

    C++基本内置类型 基本内置类型包括算术类型和空类型. 算术类型 算术类型包括整型和浮点型. 类型 含义 最小尺寸 bool 布尔型 - char 字符型 8 bit wchar_t 宽字符型 16 ...

  5. 又见angular----步一步做一个angular4小项目

    这两天看了看angular4的文档,发现他和angular1.X的差别真的是太大了,官方给出的那个管理英雄的Demo是一个非常好的入门项目,这里给出一个管理个人计划的小项目,从头至尾一步一步讲解如何去 ...

  6. python--DenyHttp项目（2）--ACM监考客户端1.0版

    修复了: 360搜索可以使用的漏洞 更新版本,上一版本复制的Hosts文件保留的漏洞 #coding:gbk import os import sys from subprocess import * ...

  7. 20. Valid Parentheses【leetcode】

    20. Valid Parentheses Given a string containing just the characters '(', ')', '{', '}', '[' and ']', ...

  8. 开心的金明 NOIP 2006 普及组

    题目描述 金明今天很开心,家里购置的新房就要领钥匙了,新房里有一间他自己专用的很宽敞的房间.更让他高兴的是,妈妈昨天对他说:"你的房间需要购买哪些物品,怎么布置,你说了算,只要不超过N元钱就 ...

  9. $($('.className').html( )选择器的工作原理

    $($('.slot')[0]).html('<img src = "' + images[slotOne-1] + '">');

  10. 运行和控制Nginx

    Nginx命令行选项 启动.停止.重启nginx命令 如何重新加载nginx配置文件 nginx程序不重启平滑升级可执行文件   nginx命令行参数 不像许多其他软件系统,Nginx 仅有几个命令行 ...