js全选按钮的实现方法


Posted in Javascript onNovember 17, 2015

本文实例讲述了js全选按钮的实现代码。分享给大家供大家参考。具体如下:
运行效果截图如下:

 js全选按钮的实现方法

具体代码如下

<html>
 <head>
   <title>复选框checked属性</title>
   <script language="JavaScript" type="text/javascript">
      function changeState(isChecked)
     {
       var chk_list=document.getElementsByTagName("input");
       for(var i=0;i<chk_list.length;i++)
        {
         if(chk_list[i].type=="checkbox")
          {
           chk_list[i].checked=isChecked;
          }
        }
    }
   </script>
 </head>
 <body>
   <h1>请选择你的爱好</h1>
   <form name="myForm1">
     <input type="checkbox" name="cb1" checked>看书<br>
     <input type="checkbox" name="cb2" checked>上网<br>
     <input type="checkbox" name="cb3">游戏<br>
   </form>
   <hr>
   <form name="myForm2">
     <input type="checkbox" name="cb" onclick="changeState(this.checked)">全选
   </form>
 </body>
</html>

以上就是js全选按钮的实现方法,希望对大家的学习有所帮助。

Javascript 相关文章推荐
JavaScript中的Document文档对象
Jan 16 Javascript
for 循环性能比较 提高for循环的效率
Mar 19 Javascript
javascript 面向对象 function类
May 13 Javascript
js一般方法改写成面向对象方法的无限级折叠菜单示例代码
Jul 04 Javascript
利用javascript实现web页面中指定区域打印
Oct 30 Javascript
javascript动态控制服务器控件实例
Sep 05 Javascript
使用coffeescript编写node.js项目的方法汇总
Aug 05 Javascript
js实现仿京东2级菜单效果(带延时功能)
Aug 27 Javascript
JS禁用页面上所有控件的实现方法(附demo源码下载)
Dec 17 Javascript
微信小程序中使元素占满整个屏幕高度实现方法
Dec 14 Javascript
vue中根据时间戳判断对应的时间(今天 昨天 前天)
Dec 20 Javascript
详解vue v-model
Aug 31 Javascript
javascript实现省市区三级联动下拉框菜单
Nov 17 #Javascript
javascript中return,return true,return false三者的用法及区别
Nov 17 #Javascript
jquery表单验证需要做些什么
Nov 17 #Javascript
今天抽时间给大家整理jquery和ajax的相关知识
Nov 17 #Javascript
jquery验证手机号是否正确实例讲解
Nov 17 #Javascript
跟我学习javascript的prototype使用注意事项
Nov 17 #Javascript
js弹出对话框方式小结
Nov 17 #Javascript
You might like
PHP-FPM运行状态的实时查看及监控详解
2016/11/18 PHP
thinkphp3.2中实现phpexcel导出带生成图片示例
2017/02/14 PHP
PHP getNamespaces()函数讲解
2019/02/03 PHP
javascript各浏览器中option元素的表现差异
2011/04/07 Javascript
JavaScript字符串String和Array操作的有趣方法
2012/12/18 Javascript
js操作输入框提示信息且响应鼠标事件
2014/03/25 Javascript
JQuery1.8 判断元素是否绑定事件的方法
2014/07/10 Javascript
jquery表单验证插件formValidator使用方法
2016/04/01 Javascript
前端js文件合并的三种方式推荐
2016/05/19 Javascript
Boostrap基础教程之JavaScript插件篇
2016/09/08 Javascript
零基础轻松学JavaScript闭包
2016/12/30 Javascript
JS排序之冒泡排序详解
2017/04/08 Javascript
详解vue-cli开发环境跨域问题解决方案
2017/06/06 Javascript
BootStrap导航栏问题记录
2017/07/31 Javascript
Vue使用高德地图搭建实时公交应用功能(地图 + 附近站点+线路详情 + 输入提示+换乘详情)
2018/05/16 Javascript
vue脚手架搭建项目的兼容性配置详解
2018/07/17 Javascript
JavaScript捕捉事件和阻止冒泡事件实例分析
2018/08/03 Javascript
使用VUE+iView+.Net Core上传图片的方法示例
2019/01/04 Javascript
js最实用string(字符串)类型的使用及截取与拼接详解
2019/04/26 Javascript
微信小程序在ios下Echarts图表不能滑动的问题解决
2019/07/10 Javascript
vue h5移动端禁止缩放代码
2019/10/28 Javascript
vue 通过绑定事件获取当前行的id操作
2020/07/27 Javascript
简单了解python中的f.b.u.r函数
2019/11/02 Python
Python实现将蓝底照片转化为白底照片功能完整实例
2019/12/13 Python
linux环境下安装python虚拟环境及注意事项
2020/01/07 Python
最简单的matplotlib安装教程(小白)
2020/07/28 Python
python 动态绘制爱心的示例
2020/09/27 Python
医学毕业生自荐信
2013/10/11 职场文书
制冷与电控专业应届生求职信
2013/11/11 职场文书
创先争优活动心得体会
2014/09/04 职场文书
大学生就业协议书范本(适用于公司企业)
2014/10/07 职场文书
暑期社会实践新闻稿
2015/07/17 职场文书
标枪加油稿
2015/07/22 职场文书
旅游安全责任协议书
2016/03/22 职场文书
《家世》读后感:看家训的力量
2019/12/30 职场文书
Go语言特点及基本数据类型使用详解
2022/03/21 Golang