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 相关文章推荐
10个基于Jquery的幻灯片插件教程
Oct 29 Javascript
json的定义、标准格式及json字符串检验
May 11 Javascript
JS创建类和对象的两种不同方式
Aug 08 Javascript
jQuery实现鼠标悬停显示提示信息窗口的方法
Apr 30 Javascript
浏览器环境下JavaScript脚本加载与执行探析之动态脚本与Ajax脚本注入
Jan 19 Javascript
js从数组中删除指定值(不是指定位置)的元素实现代码
Sep 13 Javascript
vue在使用ECharts时的异步更新和数据加载详解
Nov 22 Javascript
Element-ui之ElScrollBar组件滚动条的使用方法
Sep 14 Javascript
JavaScript ES6中的简写语法总结与使用技巧
Dec 30 Javascript
解决layui下拉框监听问题(监听不到值的变化)
Sep 28 Javascript
JS使用正则表达式实现常用的表单验证功能分析
Apr 30 Javascript
js实现筛选功能
Nov 24 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
php木马攻击防御之道
2008/03/24 PHP
PHP 抓取新浪读书频道的小说并生成txt电子书的代码
2009/12/18 PHP
QQ登录 PHP OAuth示例代码
2011/07/20 PHP
php while循环控制的简单实例
2016/05/30 PHP
让Laravel API永远返回JSON格式响应的方法示例
2018/09/05 PHP
使用PHP+Redis实现延迟任务,实现自动取消订单功能
2019/11/21 PHP
PHP正则表达式函数preg_replace用法实例分析
2020/06/04 PHP
裁剪字符串trim()自定义改进版
2013/04/10 Javascript
firefox浏览器不支持innerText的解决方法
2013/08/07 Javascript
Javascript 正则表达式校验数字的简单实例
2016/11/02 Javascript
微信小程序 时间格式化(util.formatTime(new Date))详解
2016/11/16 Javascript
Vue监听数据对象变化源码
2017/03/09 Javascript
vue-cli3+ts+webpack实现多入口多出口功能
2019/05/30 Javascript
使用Vue调取接口,并渲染数据的示例代码
2019/10/28 Javascript
vue导航栏部分的动态渲染实例
2019/11/01 Javascript
vue中实现回车键登录功能
2020/02/19 Javascript
vue.js实现简单的计算器功能
2020/02/22 Javascript
jquery实现两个div中的元素相互拖动的方法分析
2020/04/05 jQuery
Openlayers+EasyUI Tree动态实现图层控制
2020/09/28 Javascript
JavaScript读取本地文件常用方法流程解析
2020/10/12 Javascript
Python实现的快速排序算法详解
2017/08/01 Python
opencv python 傅里叶变换的使用
2018/07/21 Python
Python理解递归的方法总结
2019/01/28 Python
pygame用blit()实现动画效果的示例代码
2020/05/28 Python
Python应用实现双指数函数及拟合代码实例
2020/06/19 Python
CSS3中的content属性使用示例
2015/07/20 HTML / CSS
HTML5 常见面试题之PC端和移动端区别介绍
2018/01/22 HTML / CSS
毕业自我评价
2014/02/05 职场文书
经营理念标语
2014/06/21 职场文书
纪念九一八事变演讲稿:牢记历史,捍卫主权
2014/09/14 职场文书
道歉信怎么写
2015/05/12 职场文书
董事会决议范本
2015/07/01 职场文书
2016年感恩教师节校园广播稿
2015/12/18 职场文书
外出学习心得体会范文
2016/01/18 职场文书
SONY AN-LP1 短波有源天线放大器图
2022/04/05 无线电
CSS中使用grid布局实现一套模板多种布局
2022/07/15 HTML / CSS