<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"

"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">

	<span style="font-size: 24px;">javascript 案例 全选 不选  反选</span><br />

	<head>

		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

		<title>全选 不选  反选</title>

	</head>

	<script>

window.onload=function (){  

   var oBtn1=document.getElementById("Btn1");

   var oBtn2=document.getElementById("Btn2");

   var oBtn3=document.getElementById("Btn3");

   var oDiv=document.getElementById("Ben");

   var oInp=oDiv.getElementsByTagName("input");  

   oBtn1.onclick=function(){     //全选

        //oInp[0].checked=true;   // checked ： 布尔值  false  true;

         for(var i=0; i<oInp.length ; i++){

         oInp[i].checked=true;

        }

   };

   oBtn2.onclick=function(){    //不选

        for(var i=0; i<oInp.length ; i++){

              oInp[i].checked=false;

        }

   };

   oBtn3.onclick=function(){    //反选

        for(var i=0; i<oInp.length ; i++){

            if(oInp[i].checked==true){  

                oInp[i].checked=false;

            }

            else{

                oInp[i].checked=true;

            }

        }

   };

};  

</script>

	<body>

	<input id="Btn1" type="button" value="全选" /><br />

    <input id="Btn2" type="button" value="不选" /><br />

    <input id="Btn3" type="button" value="反选" /><br />

    <div id="Ben">

<input type="checkbox"  /><br />

<input type="checkbox" /><br />  <!--复选框   checked  选中-->

<input type="checkbox" /><br />

<input type="checkbox" /><br />

<input type="checkbox" /><br />

<input type="checkbox" /><br />

<input type="checkbox" /><br />

<input type="checkbox" /><br />

<input type="checkbox" /><br />

<input type="checkbox" /><br />

<input type="checkbox" /><br />

<input type="checkbox" /><br />

</div>  

	</body>

</html>

　　

js---复选框（全选，不选，反选）demo1--的更多相关文章

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

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

  2. html+css+js实现复选框全选与反选

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

  3. js 判断 复选框全选、全不选、反选、必选一个

    一个挺 使用的 js 代码片段,  判断  复选框全选.全不选.反选.必选一个 记录下, 搬来的 思路: 修改数据的 选中与否状态, 拿到所有的输入框,看是否有选中的状态 <html> & ...

  4. FineReport——JS二次开发（复选框全选）

    在进行查询结果选择的时候,我们经常会用到复选框控件,对于如何实现复选框全选,基本思路: 在复选框中的初始化事件中把控件加入到一个全局数组里,然后在全选复选框里对数组里的控件进行遍历赋值. 首先,定义两 ...

  5. js实现复选框全选/全不选/反选

    js实现复选框全选/全不选/反选 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...

  6. checkbox复选框全选批量删除

    多选框全选实现批量删除 html代码 <body> <form action="" method="post" name="Form ...

  7. jQuery 复选框全选/取消全选/反选

    jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...

  8. jQuery实现复选框 全选、反选、全不选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  9. js进阶 9-16 如何实现多选框全选和取消

    js进阶 9-16 如何实现多选框全选和取消 一.总结 一句话总结:选择取到每一个checkbox的值,然后赋值为true或者false就好. 1.如何实现多选框全选和取消? 选择取到每一个check ...

  10. jQuery 前端复选框 全选 反选 下拉菜单联动

    jQuery 页面中复选框全选.反选.下拉联动(级联) <!DOCTYPE html> <html lang="en"> <head> < ...

随机推荐

  1. css position: relative，absolute具体解释

    关于CSS中 position在布局中非常重要,查了非常多资料都说的非常难理解.以下说说个人的理解: 语法: position: relative | absolute relative: 对象遵循常 ...

  2. VLFeat图像库在VS2012下的配置

         近期做课题所需,開始使用VLFeat图像库.      库下载链接:      http://download.csdn.net/detail/sunboyiris/7500097     ...

  3. linux 11 -- mount，umount

    Linux 文件系统是一个以 / 为根的大树,我们在不同的设备和分区上都有文件系统.我们如何处理这种明显的不一致性?根 (/) 文件系统是在初始化过程中挂载的.您创建的其他每个文件系统在挂载 在挂载点 ...

  4. 通过systemd配置Docker

    1. systemd Service相关目录 通常情况下,我们有3种方式可以配置etcd中的service.以docker为例,1)在目录/etc/systemd/system/docker.serv ...

  5. Navicat试用期破解方法（转）

    转载网址https://blog.csdn.net/Jason_Julie/article/details/82864187 1.按步骤安装Navicat Premium,如果没有可以去官网下载:ht ...

  6. linux中添加PHP的mongoDB支持扩展

    最近使用ThinkPHP连接mongoDB数据库进行增删改查,在使用之前,需要PHP本身支持对mongoDB的连接,下面是我安装PHP的mongoDB扩展的方法 wget -c http://pecl ...

  7. html ---- web sql 例子

    <!doctype html> <html> <head> <meta charset="utf-8"> <script> ...

  8. 20165101 预备作业3 Linux安装及学习

    #Linux安装及命令入门 安装虚拟机 学习了娄老师的博客<基于VirtualBox虚拟机安装Ubuntu图文教程>,我下载了最新版的VirtualBox和16.04版的Ubuntu.根据 ...

  9. vo类总结

    1.Camera类 camera类里面,首先camera有5个变量,fx_,fy_,cx_,cy_,depth_scale_5个变量,由外部传fx,fy,cx,cy,depth_scale给它.定义了 ...

  10. China sets economic reform priorities for 2015

    BEIJING -- China's State Council, the cabinet, on Monday unveiled this year's priorities for economi ...