js实现全选反选不选功能代码详解


Posted in Javascript onApril 24, 2019

本文实例为大家分享了js实现全选反选不选功能的具体代码,供大家参考,具体内容如下

<!DOCTYPE html>
<html>
<meta charset='utf-8' />
<body>
<input type='checkbox' name='id' />哈哈<br/>
<input type='checkbox' name='id' />哈哈<br/>
<input type='checkbox' name='id' />哈哈<br/>
<input type='checkbox' name='id' />哈哈<br/>
<input type='button' name='id' value='全选' onclick='return fun()' />
<input type='button' name='id' value='取消全选' onclick='return fan()' />
<input type='button' name='id' value='反选' onclick='return fans()' />
<script type="text/javascript">
function fun()
{
	var a=document.getElementsByName('id');
	for(var i=0;i<a.length;i++)
	{
		a[i].checked=true;
	}
}
function fan()
{
	var a=document.getElementsByName('id');
	for(var i=0;i<a.length;i++)
	{
		a[i].checked=false;
	}
}
function fans()
{
	var a=document.getElementsByName('id');
	for(var i=0;i<a.length;i++)
	{
		if(a[i].checked==true)
		{
			a[i].checked=false;	
		}
		else
		{
			a[i].checked=true;
		}
	}
}
</script>
</body>
</html>

js实现全选反选不选功能代码详解

js实现全选反选不选功能代码详解

Javascript 相关文章推荐
javascript中最常用的继承模式 组合继承
Aug 12 Javascript
javascript学习笔记(一) 在html中使用javascript
Jun 18 Javascript
JS使用replace()方法和正则表达式进行字符串的搜索与替换实例
Apr 10 Javascript
jquery实现公告翻滚效果
Feb 27 Javascript
JS+Canvas 实现下雨下雪效果
May 18 Javascript
angular实现IM聊天图片发送实例
May 08 Javascript
详谈表单格式化插件jquery.serializeJSON
Jun 23 jQuery
vuejs实现标签选项卡动态更改css样式的方法
May 31 Javascript
深入浅析Node.js 事件循环、定时器和process.nextTick()
Oct 22 Javascript
layui 监听select选择 获取当前select的ID名称方法
Sep 24 Javascript
mpvue实现左侧导航与右侧内容的联动
Oct 21 Javascript
javascript设计模式 ? 建造者模式原理与应用实例分析
Apr 10 Javascript
使用vue2.6实现抖音【时间轮盘】屏保效果附源码
Apr 24 #Javascript
Vue源码解析之数据响应系统的使用
Apr 24 #Javascript
详解微信小程序文件下载--视频和图片
Apr 24 #Javascript
详解微信小程序之一键复制到剪切板
Apr 24 #Javascript
使用vue-cli3新建一个项目并写好基本配置(推荐)
Apr 24 #Javascript
vue-cli3使用 DllPlugin 实现预编译提升构建速度
Apr 24 #Javascript
vue改变对象或数组时的刷新机制的方法总结
Apr 24 #Javascript
You might like
PHP4中实现动态代理
2006/10/09 PHP
php生成WAP页面
2006/10/09 PHP
php is_file 判断给定文件名是否为一个正常的文件
2010/05/10 PHP
PHP简洁函数(PHP简单明了函数语法)
2012/06/10 PHP
php堆排序(heapsort)练习
2013/11/13 PHP
一张表搞清楚php is_null、empty、isset的区别
2015/07/07 PHP
Yii中CGridView禁止列排序的设置方法
2016/07/12 PHP
PHP count_chars()函数讲解
2019/02/14 PHP
javascript 面向对象思想 附源码
2009/07/07 Javascript
javascript 操作cookies及正确使用cookies的属性
2009/10/15 Javascript
JavaScript中的this关键字介绍与使用实例
2013/06/21 Javascript
JavaScript实现把数字转换成中文
2015/06/29 Javascript
分享使用AngularJS创建应用的5个框架
2015/12/05 Javascript
JavaScript中Object.prototype.toString方法的原理
2016/02/24 Javascript
简单的jQuery banner图片轮播实例代码
2016/03/04 Javascript
jQuery链式调用与show知识浅析
2016/05/11 Javascript
nodejs微信公众号支付开发
2016/09/19 NodeJs
实例解析angularjs的filter过滤器
2016/12/14 Javascript
Bootstrap modal只加载一次数据的解决办法(推荐)
2017/11/24 Javascript
Angular4实现图片上传预览路径不安全的问题解决
2017/12/25 Javascript
微信小程序实现提交input信息到后台的方法示例
2019/01/19 Javascript
在微信小程序中使用mqtt服务的方法
2019/12/13 Javascript
返回上一个url并刷新界面的js代码
2020/09/12 Javascript
JS数据类型分类及常用判断方法
2020/11/19 Javascript
[08:54]DOTA2-DPC中国联赛 正赛 Aster vs LBZS 选手采访
2021/03/11 DOTA
python提取内容关键词的方法
2015/03/16 Python
基于python log取对数详解
2018/06/08 Python
详解pandas安装若干异常及解决方案总结
2019/01/10 Python
python中@property和property函数常见使用方法示例
2019/10/21 Python
解决安装pyqt5之后无法打开spyder的问题
2019/12/13 Python
Python爬虫库BeautifulSoup的介绍与简单使用实例
2020/01/25 Python
VisionPros美国站:加拿大在线隐形眼镜和眼镜零售商
2020/02/11 全球购物
高中课程设置方案
2014/05/28 职场文书
欢迎词范文
2015/01/27 职场文书
宾馆客房管理制度
2015/08/06 职场文书
2019个人工作自我评价范文(3篇)
2019/09/19 职场文书