在表单中，尤为重要的一个属性是name

<!--复选框的全选、全不选、反选-->

<!DOCTYPE>

<html>

<head lang="en">

    <meta charset="utf-8"/>

    <title>复选框的全选、全不选、反选</title>

</head>

<body>

<form id="form">

    <input type="checkbox" name="check" value="北京"  />北京

    <input type="checkbox" name="check" value="上海" />上海

    <input type="checkbox" name="check" value="广州" />广州

    <br>

    <input type="button" name="checkAll" value="全选"/>

    <input type="button" name="checkNone" value="全不选"/>

    <input type="button" name="checkOpp" value="反选"/>

</form>

<script>

    var oForm=document.getElementById("form");

    var Allbtn=oForm.checkAll;

    var Nonebtn=oForm.checkNone;

    var Oppbtn=oForm.checkOpp;

    Allbtn.onclick= function () {

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

            oForm.check[i].checked=true;

        }

    }

    Nonebtn.onclick= function () {

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

            oForm.check[i].checked=false;

        }

    }

    Oppbtn.onclick= function () {

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

            if (oForm.check[i].checked){ //被选中

                oForm.check[i].checked=false;

            }

            else{

                oForm.check[i].checked=true;

            }

        }

    }

</script>

</body>

</html>

DOM表单（复选框）的更多相关文章

  1. 表单复选框input[type="checkbox"]

    <!DOCTYPE html> <html lang="zh"> <head> <title></title> < ...

  2. AngularJS（六）：表单-复选框

    本文也同步发表在我的公众号“我的天空” 复选框 复选框只有两个值:true或者false,因此在AngularJS中,一般都是将复选框的ng-model绑定为一个布尔值属性,通过这两个布尔值来决定其勾 ...

  3. SpringMVC 表单复选框处理

    <form action="" method="post"> <c:forEach items="${dblist}" v ...

  4. javascript入门 之 ztree (九 单/复选框问题)

    <!DOCTYPE html> <HTML> <HEAD> <meta http-equiv="content-type" content ...

  5. JQuery:JQuery基本语法,JQuery选择器,JQuery DOM,综合案例 复选框,综合案例 随机图片

    知识点梳理 课堂讲义 1.JQuery快速入门 1.1.JQuery介绍 jQuery 是一个 JavaScript 库. 框架:Mybatis (jar包) 大工具 插件:PageHelper (j ...

  6. bootstrap 列表 表格 表单 复选 单选 多选 输入框组

    一.列表 ul li 二.表格 table  (http://www.runoob.com/bootstrap/bootstrap-tables.html) 1. 基本表格 <table cla ...

  7. Android布局——单复选框（今天上课的内容总结下）

    怎么感觉最近补充的都是监听器的内容,今天学长提了一个新的监听器,看起来很牛批(因为很长) // 添加文本更改的监听器, TextWatcher是监听器的回调接口 text.addTextChanged ...

  8. 8个非常个性化的CSS3单/复选框

    单选框和复选框在网页表单中应用十分广泛,但是浏览器默认自带的单选框和复选框样式不仅不统一,而且大多都比较简单丑陋.本文给大家介绍了一些基于CSS3的个性化单选框和复选框,一些选中动画是基于jQuery ...

  9. Android之单复选框及Spinner实现二级联动

    一.基础学习 1.图形学真的很神奇啊....查了些资料做出了3D云标签,哈哈...其实直接拿来用的,我们要效仿鲁迅先生的拿来主义,嘿嘿~~3D标签云就是做一个球面,然后再球面上取均匀分布的点,把点坐标 ...

  10. python selenium单/复选框操作

    一.单选:radio 1.首先是定位选择框的位置 2.定位id,点击图标就可以了,代码如下(获取url地址方法:把上面源码粘贴到文本保存为.html后缀后用浏览器打开,在浏览器url地址栏复制出地址就 ...

随机推荐

  1. Python-注册登陆-20

    username = input('请输入你要注册的用户名:') password = input('请输入你要注册的密码:') with open('list_of_info',mode='w',e ...

  2. 【ML】ICML2015_Unsupervised Learning of Video Representations using LSTMs

    Unsupervised Learning of Video Representations using LSTMs Note here: it's a learning notes on new L ...

  3. beta（3/7）

    团队信息 队名:爸爸饿了 组长博客:here 作业博客:here 组员情况 组员1(组长):王彬 过去两天完成了哪些任务 协助后端完成历史记录接口.美食排行榜接口 完成食堂平面图的绘制 确定web端业 ...

  4. BugPhobia进阶篇章：系统架构技术规格

    0x01 :开发级需求分析 在开发过程中,团队本身在开发的起始阶段确定了基本的开发级需求分析: 在开发过程中,除了需要满足用户级需求以为,我们还需要针对开发团队的特点,满足一些开发级的需求和约束.作为 ...

  5. CentOS7.3安装rz、sz命令

    安装命令: yum install lrzsz 关于rz.sz: lrzsz是一款在linux里可代替ftp上传和下载的程序.lrzsz是一个unix通信套件提供的X,Y,和ZModem文件传输协议. ...

  6. 『编程题全队』Beta 阶段冲刺博客二

    1.提供当天站立式会议照片一张 2.每个人的工作 (有work item 的ID) (1) 昨天已完成的工作 孙志威: 1.添加了SubTask类,完成基本UI 2.为SubTask类添加了展开/收缩 ...

  7. PHP使用Redis实现消息队列

    消息队列可以使用MySQL来实现,可以参考博客PHP使用MySQL实现消息队列,虽然用MySQL可以实现,但是一般不这么用,因为MySQL的数据都存在硬盘中,而从硬盘中对MySQL的操作,I/O花费的 ...

  8. Solution of wireless link "PCI unknown" on Centos 7.1

    Pick From http://www.blogjava.net/miaoyachun/archive/2015/09/17/427366.html After Centos 7.1 tobe in ...

  9. [转帖]Linux内核为大规模支持100Gb/s网卡准备好了吗？并没有

    Linux内核为大规模支持100Gb/s网卡准备好了吗?并没有 之前用 千兆的机器 下载速度 一般只能到 50MB 左右 没法更高 万兆的话 可能也就是 200MB左右的速度 很难更高 不知道后续的服 ...

  10. linux_目录基本操作

    ls命令 ls命令用来显示目标列表,在Linux中是使用率较高的命令.ls命令的输出信息可以进行彩色加亮显示,以分区不同类型的文件. 语法 $ ls [选项] [目录] 选项 说明 -a 显示所有档案 ...