<style type="text/css">
table {
width: 800px;
text-align: left;
border-collapse: collapse;
} td, th {
padding: 10px;
border: 1px solid black;
}
</style>
<script type="text/javascript"> // 反选
function choose(tag) {
var inputs = document.getElementsByTagName("input");
//全选
for (var i = 0; i < inputs.length - 3; i++) {
var inputNode = inputs[i];
if (tag === 1) {
if (!inputs[i].checked) {
inputs[i].checked = true;
}
//全不选
} else if (tag === -1) {
if (inputNode.checked) {
inputNode.checked = false;
}
} else {
//反选
inputs[i].checked = !inputs[i].checked;
}
}
}
</script>
</head>
<body>
<table cellpadding="2" id="tableId">
<tr>
<th>
选择
</th>
<th>
姓名
</th>
<th>
年龄
</th>
</tr>
<tr>
<td>
<label>
<input type="checkbox">
</label>
</td>
<td>
张三
</td>
<td>
19
</td>
</tr>
<tr>
<td>
<input type="checkbox">
</td>
<td>
李四
</td>
<td>
18
</td>
</tr>
<tr>
<td>
<input type="checkbox">
</td>
<td>
张三
</td>
<td>
18
</td>
</tr>
<tr>
<td colspan="3">
<input type="button" onclick="choose(1)" value="全选">
<input type="button" onclick="choose(-1)" value="全不选">
<input type="button" onclick="choose(0)" value="反选">
</td>
</tr>
</table>

js全选反选的更多相关文章

  1. jquery、js全选反选checkbox

    操作checkbox,全选反选 //全选 function checkAll() { $('input[name="TheID"]').attr("checked&quo ...

  2. JS全选反选功能

    总选框:<input type="checkbox" class="all" name="all"> 子选框: <inpu ...

  3. js全选 反选

    // 全选 反选 allChoose: function (o) { var obj = $.extend(true, { id: "#id", name: "name& ...

  4. js 全选 反选

    1.全选 function selectAll(form){ for (var i = 0; i < form.elements.length; i++) { if (form.elements ...

  5. 关于js 全选 反选

    prop 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法. attr  对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法. $("#selectAll ...

  6. html js 全选 反选 全不选源代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  7. js全选反选按钮实现

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

  8. js 全选反选

    <th><input type="checkbox" id="checkall" name="checkall" oncl ...

  9. js和jq实现全选反选

    在前端中用到全选反选的案例并不少,在这里呢我就实现这个功能给大家参考参考. 这里呢就先贴上我的html和css代码 <div class="wrap"> <tab ...

随机推荐

  1. Android Studio 3.0.1 版本包下载

    Android Studio 3.0.1 发布了,这是对 Android Studio 3.0 的一个小的更新,包括一般错误修复和性能改进 下载地址: Windows 64 位:https://dl. ...

  2. vue-resource使用 (vue仿百度搜索)

    1.this.$http.get()方法2.this.$http.post()方法3.this.$http.jsonp()方法 (vue仿百度搜索) 在输入框中输入a, 然后在百度f12 ==> ...

  3. 硬件RDMA的驱动配置和测试

    author:headsen chen date: 2019-01-18  10:22:20 notice:created  by headsen chen himself and not allow ...

  4. DragonBones龙骨换装(局部换装+全局换装)

    参考: Egret官方换装动画 Egret换装三种方式 CSDN(全局换装) egret使用DragonBones实现简单的换装 换装,主要是替换任意插槽的图片,来达到局部换装的目的. 游戏中可以只制 ...

  5. 判断String 中文混输 长度

    extends:http://www.tuicool.com/articles/EB36Jv public static int calculateLength(String etString) { ...

  6. Android studio was unable to create a local connection in order...

    以管理员身份运行cmd 输入netsh winsock reset 重启电脑

  7. ztree学习---将默认勾选的展开

    这里只给出前台页面上的代码,数据可以从后台获取,注意,在封装数据的时候,注意:Id(节点的id,可以是数字也可以是字符串) , pid(父亲节点的id) , name(节点名称)不能少 . html页 ...

  8. [转]-[携程]-A Hybrid Collaborative Filtering Model with Deep Structure for Recommender Systems

    原文链接:推荐系统中基于深度学习的混合协同过滤模型 近些年,深度学习在语音识别.图像处理.自然语言处理等领域都取得了很大的突破与成就.相对来说,深度学习在推荐系统领域的研究与应用还处于早期阶段. 携程 ...

  9. 【巷子】---fetch---基本使用

    一.fetch fetch是一种XMLHttpRequest的一种替代方案,在工作当中除了用ajax获取后台数据外我们还可以使用fetch.axios来替代ajax 二.fetch的基本使用 1.np ...

  10. Visual Studio 2017 调试 windows server 2016 Docker Container

    网上很多文章都是在win10下,用Docker for windows工具进行Docker的安装部署的.用知道windows server 2016已经原生支持Docker了,其windows Con ...