javascript实现复选框单选多选!
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>全选、反选</title>
</head>
<body>
<form>
<input type="checkbox" name="" id="all" onclick="selectAll();" />全选<br />
<hr /><br />
<input class="chk" type="checkbox" name="chk" onclick="selectSingle();" />菜单一<br /><br />
<input class="chk" type="checkbox" name="chk" onclick="selectSingle();" />菜单二<br /><br />
<input class="chk" type="checkbox" name="chk" onclick="selectSingle();" />菜单三<br /><br />
<input class="chk" type="checkbox" name="chk" onclick="selectSingle();" />菜单四<br /><br />
</form>
<script type="text/javascript" >
var dom=document.getElementById('all');
var doms=document.getElementsByName('chk');
function selectAll(){
var len = doms.length;
for(var i=0;i<len;i++){
if(dom.checked){
doms[i].checked=true;
}else{
doms[i].checked=false;
};
}
};
function selectSingle(){
let len = 0;
let count = doms.length;
for(var i=0;i<count;i++){
if(doms[i].checked==true){
len++;
}
}
if (count == len) {
dom.checked = true;
}else{
dom.checked = false;
}
}
</script>
</body>
</html>
javascript实现复选框单选多选!的更多相关文章
- 使用vue实现复选框单选多选
界面样式: <div class="right_con" v-if="isClickApply" style="border:none" ...
- [CSS]复选框单选框与文字对齐问题的研究与解决.
前言:今天碰到的这个问题, 恰好找到一个很好的博文, 在这里转载过来 学习下. 原文地址:复选框单选框与文字对齐问题的研究与解决. 目前中文网站上面的文字,就我的个人感觉而言,绝大多数网站的主流文字大 ...
- ylbtech-数据库设计与优化-对作为复选框/单选列表的集合表的设计
ylbtech-DatabaseDesgin:ylbtech-数据库设计与优化-对作为复选框/单选列表的集合表的设计 -- DatabaseName:通用表结构-- -- 主要是针对将要设计的表对象, ...
- 关于SWT常用组件(按钮,复选框,单选框(Button类))
Button是SWT中最常用的组件.Button类的继承关系图: Button类的构造方法是newe Button(Composite parent,int style)它有两个参数: 第一个参数:是 ...
- MFC控件编程之复选框单选框分组框
MFC控件编程之复选框单选框分组框 一丶分组框 分组框 英文叫做 GroubBox 添加了分组框主要就是分组.好看.不重点介绍 二丶单选框 英文: Raido Button 单选框需要注意的事项 1. ...
- 【JavaScript】实现复选框的全选、全部不选、反选
以较为简洁的程序实现复选框的全选.全部不选.反选 操作. 并且将可变的部分设置为JS的参数,以实现代码复用. 全选和全不选 第一个参数为复选框名称,第二个参数为是全选还是全部不选. function ...
- ztree根据参数动态控制是否显示复选框/单选框(静态JSON数据)
本文不再更新,可能存在内容过时的情况,实时更新请访问原地址:ztree根据参数动态控制是否显示复选框/单选框(静态JSON数据): 现有全省各地区静态JSON数据,现在想通过Url参数,动态控制是否显 ...
- js实现复选框的全选、全不选、反选
js中实现复选框的全选,全不选以及反选,分为两种情况: (1)选中“请选择”前面的复选框实现全选,不选中“请选择”前面的复选框实现全不选 <!DOCTYPE html PUBLIC " ...
- JQ实现复选框的全选反选不选
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- C++模板详解(系转载,但是个人添加了一些内容)
原文地址:http://www.cnblogs.com/gw811/archive/2012/10/25/2738929.html 零.概述 模板是C++支持参数化多态的工具,使用模板可以使用户为类或 ...
- matlab练习程序(三角形外接圆)
三角形两边的垂直平分线就能确定外接圆. 结果如下: matlab代码如下: clear all;close all;clc; p=rand(,); %(x,y) cen1=(p(,:)+p(,:))/ ...
- Windows下 Mysql启动报1067解决方法
前几天刚入职安装了一下Mysql 刚开始能打开 今天去公司发现启动不了服务 报1067错误, 在网上查看了一些方法,好多种版本..以下是本人的解决方法 1.打开运行-事件查看器--Windows日 ...
- nlinfit非线性回归拟合
% % 使用指定函数对下述两变量进行曲线拟合 % % y=a+k1*exp(m*t)+k2*exp(-m*t); % % 离散点: t=[0,4,8,40], % % y=[20.09,64.5 ...
- 如何一次性下载某个类库依赖的所有jar包"
** 经常碰到这种事情: ** 在一些非maven工程中(由于某种原因这种工程还是手工添加依赖的),需要用到某个新的类库(假设这个类库发布在maven库中),而这个类库又间接依赖很多其他类库,如果依赖 ...
- 第五周 day5 python学习笔记
1.软件开发的常规目录结构 更加详细信息参考博客:http://www.cnblogs.com/alex3714/articles/5765046.html 2.python中的模块 ...
- CentOS 7 Nginx+PHP环境搭建!
1.Nginx 安装 rpm -Uvh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0.el7.ngx. ...
- Dom4j的一个小例子,用于解析xml文件的元素获取方式
import java.io.File; import java.io.IOException; import javax.xml.parsers.ParserConfigurationExcepti ...
- System IPC 与Posix IPC(semaphore信号灯)
POSIX下IPC主要包括三种: posix message queue posix semaphores posix shared memory sysytem v IPC包括: system v ...
- Codeforces Round #430 (Div. 2) 【A、B、C、D题】
[感谢牛老板对D题的指点OTZ] codeforces 842 A. Kirill And The Game[暴力] 给定a的范围[l,r],b的范围[x,y],问是否存在a/b等于k.直接暴力判断即 ...