JavaScript实现全选和全不选
<!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实现全选和全不选的更多相关文章
- JavaScript小例子:复选框全选
JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...
- 表单javascript checkbox全选 反选 全不选
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...
- 【JavaScript】实现复选框的全选、全部不选、反选
以较为简洁的程序实现复选框的全选.全部不选.反选 操作. 并且将可变的部分设置为JS的参数,以实现代码复用. 全选和全不选 第一个参数为复选框名称,第二个参数为是全选还是全部不选. function ...
- JavaScript学习——使用JS完成全选和全不选操作
1.我们希望在后台系统实现一个批量删除的操作(全选所有的复选框)和全不选,显示效果如下: 2.步骤分析: 第一步:确定事件(onclick)并为其绑定一个函数(事件绑定到编号前面的复选框里面) 第二步 ...
- js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中
<!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...
- CheckBox复选框全选以及获取值
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- 全选,全不选,反选的js实现
全选练习 ** 使用复选框上面一个属性判断是否选中 - checked属性 - checked=true:选中 ...
- html table之 全选,全不选
就是这个小功能让我和组长引发争端,就是这个小功能让我差点"被"辞职,就是这个自封装的js方法让我放下了对组长的敬畏之心,现在分享一下,其实也很简单,但是真的有这么简单吗? < ...
- 纯JavaScripst的全选、全不选、反选 【转】
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 复选框全选、全不选和反选的效果实现VIEW:1592
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
随机推荐
- ES6中的模块
前面的话 JS用"共享一切"的方法加载代码,这是该语言中最容出错且容易令人感到困惑的地方.其他语言使用诸如包这样的概念来定义代码作用域,但在ES6以前,在应用程序的每一个JS中定义 ...
- Vue项目搭建完整剖析全过程
Vue项目搭建完整剖析全过程 项目源码地址:https://github.com/ballyalex 有帮助的话就加个星星呗~! 项目技术栈:vue+webpack+bower+sass+axios ...
- 第五章之S5PV210将u-boot.bin从SD卡中搬到DDR中
1,在完成上一节的memory初始化后,接下来在arch/arm/cpu/armv7/start.S的160行:如下图 2,跳转到arch/arm/lib/board.c下的board_init_f函 ...
- VM虚拟机中安装Linux操作系统
本文操作步骤,笔者已实验成功 (前提:正确安装VM并激活) 1,点击新建虚拟机,在页面上选择"自定义",点击下一步 2,进入选择虚拟机硬件兼容页面,这里一般不用操作,直接点击下一步 ...
- 37. leetcode 108. Convert Sorted Array to Binary Search Tree
108. Convert Sorted Array to Binary Search Tree 思路:利用一个有序数组构建一个平衡二叉排序树.直接递归构建,取中间的元素为根节点,然后分别构建左子树和右 ...
- FarmCraft[POI2014]
题目描述 In a village called Byteville, there are houses connected with N-1 roads. For each pair of ho ...
- js prototype 继承
//继承 function inherits(ctor,superCtor){ ctor.super_ = superCtor; ctor.prototype = Object.create(supe ...
- vue指令v-bind示例解析
1.绑定一个属性 <img id="app" v-bind:src="imageSrc"> <script> var app = Vue ...
- ORACLE处理用户进程大剖析[阅读]
下面我们要讲ORACLE服务器进程如何处理用户进程的请求,当一个用户进程发出了一条SQL语名: UPDATE TABBLEA SET SALARY=SALARY*2: 首先,服务器进程把这条语 ...
- window响应拖拽文件操作
window响应拖拽文件操作 1.首先调用DragAcceptFiles,让控件或者窗体支持文件拖动操作函数功能:用来为拖放文件作初始化.函数原型: void DragAcceptFiles( HWN ...