js实现(全选)多选按钮的方法【附实例】


Posted in Javascript onMarch 30, 2016

第一种,全部选中:

<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实现(全选)多选按钮的方法【附实例】

第二种,选中指定的。

以上这篇js实现(全选)多选按钮的方法【附实例】就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用js一次改变多个input的readonly属性值的方法
Jun 11 Javascript
JavaScript实现点击自动选择TextArea文本的方法
Jul 02 Javascript
javascript实现的上下无缝滚动效果
Sep 19 Javascript
深入理解javascript中的 “this”
Jan 17 Javascript
vue 多入口文件搭建 vue多页面搭建的实例讲解
Mar 12 Javascript
vue.js 2.*项目环境搭建、运行、打包发布的详细步骤
May 01 Javascript
微信小程序云开发修改云数据库中的数据方法
May 18 Javascript
让 babel webpack vue 配置文件支持智能提示的方法
Jun 22 Javascript
node.js使用stream模块实现自定义流示例
Feb 13 Javascript
Vue中通过vue-router实现命名视图的问题
Apr 23 Javascript
vue项目中使用多选框的实例代码
Jul 22 Javascript
Element InputNumber 计数器的实现示例
Aug 03 Javascript
用JS生成UUID的方法实例
Mar 30 #Javascript
如何通过js实现图片预览功能【附实例代码】
Mar 30 #Javascript
jquery $.trim()去除字符串空格的实现方法【附图例】
Mar 30 #Javascript
jquery实现简单的banner轮播效果【实例】
Mar 30 #Javascript
jquery实现一个简单的表单验证实例
Mar 30 #Javascript
js实现密码强度检测【附示例】
Mar 30 #Javascript
原生javascript实现的一个简单动画效果
Mar 30 #Javascript
You might like
PHP+APACHE实现用户论证的方法
2006/10/09 PHP
php中使用Akismet防止垃圾评论的代码
2011/06/10 PHP
ThinkPHP表单令牌错误的相关解决方法分析
2016/05/20 PHP
laravel-admin表单提交隐藏一些数据,回调时获取数据的方法
2019/10/08 PHP
php pdo连接数据库操作示例
2019/11/18 PHP
从JavaScript 到 JQuery (1)学习小结
2009/02/12 Javascript
javascript中length属性的探索
2011/07/31 Javascript
各情景下元素宽高的获取实现代码
2011/09/13 Javascript
javascript使用location.search的示例
2013/11/05 Javascript
javascript实现通过表格绘制颜色填充矩形的方法
2015/04/21 Javascript
js模仿php中strtotime()与date()函数实现方法
2015/08/11 Javascript
浅析AngularJS Filter用法
2015/12/28 Javascript
AngularJS bootstrap启动详解及实例代码
2016/09/14 Javascript
基于Layer+jQuery的自定义弹框
2020/05/26 Javascript
jQuery实现倒计时重新发送短信验证码功能示例
2017/01/12 Javascript
详解本地Node.js服务器作为api服务器的解决办法
2017/02/28 Javascript
ES6中箭头函数的定义与调用方式详解
2017/06/02 Javascript
JavaScript实现多叉树的递归遍历和非递归遍历算法操作示例
2018/02/08 Javascript
AjaxUpLoad.js实现文件上传
2018/03/05 Javascript
搭建一个Koa后端项目脚手架的方法步骤
2019/05/30 Javascript
Python自动化构建工具scons使用入门笔记
2015/03/10 Python
python通过smpt发送邮件的方法
2015/04/30 Python
python音频处理用到的操作的示例代码
2017/10/27 Python
Python控制Firefox方法总结
2019/06/03 Python
html5 css3网站菜单实现代码
2013/12/23 HTML / CSS
美国领先的家居装饰和礼品商店:Kirkland’s
2017/01/30 全球购物
美国渔具店:FishUSA
2019/08/07 全球购物
泰国第一在线超市:Tops
2021/02/13 全球购物
我有一个char * 型指针正巧指向一些int 型变量, 我想跳过它们。 为什么如下的代码((int *)p)++; 不行?
2013/05/09 面试题
小学生家长评语集锦
2014/01/30 职场文书
房地产公司见习自我鉴定
2014/04/28 职场文书
安全生产工作汇报材料
2014/10/28 职场文书
党员示范岗材料
2014/12/19 职场文书
教师考核评语大全
2014/12/31 职场文书
在职证明范本
2015/06/15 职场文书
2019年共青团工作条例最新版
2019/11/12 职场文书