<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="" />
<meta name="copyright" content="" />
<title></title>
<style>
*{ margin:0; padding:0; list-style:none; font-family: "微软雅黑","张海山锐线体简"}
#div1{border-top:#333 10px solid;}
</style>
<script>
window.onload=function(){
var oBtn=document.getElementById('btn1');
var oBtn2=document.getElementById('btn2');
var oBtn3=document.getElementById('btn3');
var oDiv=document.getElementById('div1');
var aIpt=oDiv.getElementsByTagName('input');
//全选
oBtn.onclick=function(){
for(var i=0;i<aIpt.length;i++){
aIpt[i].checked=true;
}
};
//不选
oBtn2.onclick=function(){
for(var i=0;i<aIpt.length;i++){
aIpt[i].checked=false;
}
}; //反选
oBtn3.onclick=function(){
for(var i=0;i<aIpt.length;i++){
aIpt[i].checked=!aIpt[i].checked;
}
};
};
</script>
</head> <body> <input type="button" value="全选" id="btn1">
<input type="button" value="不选" id="btn2">
<input type="button" value="反选" id="btn3"> <div id="div1">
<input type="checkbox" checked="true"><br>
<input type="checkbox"><br>
<input type="checkbox"><br>
<input type="checkbox"><br>
<input type="checkbox"><br>
</div> </body>
</html>

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

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

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

  2. 原生JS实现购物车全选多选按钮功能

    对于JS初学者来说,一个完整的购物车实现还是挺难的,逻辑功能挺多.写出完整功能,能提升不少JS基础,下面实现购物车全选多选按钮功能: 首先HTML及CSS部分: <style> table ...

  3. 原生js实现在表格用鼠标框选并有反选功能

    今天应同学要求,需要写一个像Excel那样框选高亮,并且实现框选区域实现反选功能.要我用原生js写,由于没什么经验翻阅了很多资料,第一次写文章希望各位指出不足!! 上来先建表 <div clas ...

  4. ExtJS中,将Grid表头中的全选复选框取消复选

    今天发现公司产品用的EXTJS中使用Grid时,Grid表头中的全选复选框的选中状态不是很准确,就写了这个小扩展 在js中加入下面方法,在需要取消全选的地方调用即可,例:Ext.getCmp('gri ...

  5. JS实现页面table鼠标移动改变tr行颜色,单击tr选中复选框功能

    JS源代码: //需要设置tr背景颜色 var highlightcolor='#bfecfc'; //设置背景颜色 function changeto(index){ var tr1 = docum ...

  6. [原创]纯JS实现网页中多选复选框checkbox和单选radio的美化效果

    图片素材: 最终效果图: <html><title> 纯JS实现网页中多选复选框checkbox和单选radio的美化效果</title><head>& ...

  7. WPF: 实现带全选复选框的列表控件

    本文将说明如何创建一个带全选复选框的列表控件.其效果如下图:     这个控件是由一个复选框(CheckBox)与一个 ListView 组合而成.它的操作逻辑: 当选中“全选”时,列表中所有的项目都 ...

  8. QTableWidget自定义表头QHeaderView加全选复选框

    1         QTableWidget自定义表头QHeaderView加全选复选框 在使用QTableWidget时需要在表头添加全选复选框,但是默认的表头无法添加复选框,只能用图片画上去一个复 ...

  9. WPF实现带全选复选框的列表控件

    本文将说明如何创建一个带全选复选框的列表控件.其效果如下图: 这个控件是由一个复选框(CheckBox)与一个 ListView 组合而成.它的操作逻辑: 当选中“全选”时,列表中所有的项目都会被选中 ...

  10. jQuery实现获取选中复选框的值

    <!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Jq ...

随机推荐

  1. 接着上一篇 《Is WPF dead》

    最近美国的PM传来消息,说微软在收集开发者的意见,会对WPF进行改进,微软会主要在1) performance 2) interop 3) touch and 4) access to WinRT A ...

  2. 汇编学习(二)——8086CPU

    一.8086CPU 1.微处理器 (1)微控制机:也称单片机 (2)DSP芯片:数字信号处理芯片 (3)嵌入式微处理器 (4)通用微处理器:PC站.工作站.服务器使用的处理器 2.内部结构: (1)总 ...

  3. 如何创建一个Android项目

    第一步: File -->New ---->Android Application Project 点击创建 第二步:接下来是几个下拉选择框. Minimum Required SDK 是 ...

  4. 《DSP using MATLAB》示例Example5.4

  5. 《DSP using MATLAB》示例Example5.1

    终于看到第5章了,继续努力,加油!!! 代码: xn = [0, 1, 2, 3]; N =4; Xk = dfs(xn,N) 用到的dfs函数: function [Xk] = dfs(xn,N) ...

  6. 分享Kali Linux 2016.2第49周镜像文件

    分享Kali Linux 2016.2第49周镜像文件 Kali Linux官方于12月4日发布Kali Linux 2016.2的第49周镜像.这次保持以往规律,仍然是11个镜像文件.默认的Gnom ...

  7. 记一次Runtime的巧用

    背景 我们的视频直播是用的大华乐橙的解决方案,而他们近期出来个新的SDK,并且对老版SDK不兼容,而这周,终于把大华乐橙的新版SDK切换了,和这一周做的新的东西,一起提交审核了,并且今天也通过审核了. ...

  8. BFS+Hash(储存,判重) HDOJ 1067 Gap

    题目传送门 题意:一个图按照变成指定的图,问最少操作步数 分析:状态转移简单,主要是在图的存储以及判重问题,原来队列里装二维数组内存也可以,判重用神奇的hash技术 #include <bits ...

  9. HTML无序列表和有序列表

    html无序列表<ul><li></li></ul>   ul属性设定:<ul type="square"> 常用属性值 ...

  10. angularjs学习资料

    API http://www.yiibai.com/angularjs/angularjs_scopes.html 视频 http://v.youku.com/v_show/id_XNjQ3MjA1N ...