第一种，全部选中：

<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实现(全选)多选按钮的更多相关文章

  1. js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中

    <!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...

  2. 原生JS实现购物车全选多选按钮功能

    对于JS初学者来说,一个完整的购物车实现还是挺难的,逻辑功能挺多.写出完整功能,能提升不少JS基础,下面实现购物车全选多选按钮功能: 首先HTML及CSS部分: <style> table ...

  3. JS实现简单的多选选项的全选反选按钮

    1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <!-- 5 需求: 6 1.写三个按钮: ...

  4. JS实现全选、反选、不选

    JS实现全选.反选.不选 效果图: 代码如下,复制即可使用: <!DOCTYPE html> <html> <head> <meta charset=&quo ...

  5. JS checkbox 全选 全不选

    /* JS checkbox 全选 全不选 Html中checkbox: <input type="checkbox" name="cbx" value= ...

  6. 原生JS实现全选和不全选

    案例演示 源代码 <!DOCTYPE html> <html> <head lang="en"> <meta charset=" ...

  7. 第十六篇 JS实现全选操作

    JS实现全选   嗨,同学们好,老师这里是专门教同学解决一些针对性的问题,所以说综合起来,就要靠同学自己了. 这节课我们学一个很实用的东西,全选操作!比如淘宝这种商城对吧,我的购物车,我要全选购买,或 ...

  8. elementUI+JS实现全选与反选

    在实际项目开发过程中,遇到的需求,需要实现全选以及取消全选等功能,主要使用ElementUI + JS来实现,具体代码如下: <!DOCTYPE html> <html lang=& ...

  9. js(四) 全选/全不选和反选

    思路:通过选择全选的选框的状态stuts 即true/false控制其他选框. 首先 我们要通过.checked方法获取选框(全选/全不选)的值. function all(){ var stuts= ...

  10. JS-001-单选复选按钮操作

    此文主要针对 web 页面中常见元素(例如:单选按钮.复选按钮)的 JavaScript 操作,进行简单的源码示例演示,敬请小主们参阅.若有不足之处,敬请大神指正,不胜感激! 话不多言了,直接上码: ...

随机推荐

  1. [Latex]生成Vertical Timeline

    Vertical TimeLine 用Latex生成一个竖直的VerticalTimeline的想法来源于今天翻看王老师的教师寄语,有感于学院走过的操作系统实验的艰辛之路,遂产生了写一个"小 ...

  2. android 获取当前位置

    1. Android开发位置感知应用程序方式:1. GPS 定位     精确度高,仅适用于户外,严重消耗电量.如果手机内置GPS接受模块,即使手机处于信号盲区,依然可以获取位置信息. 2. NETW ...

  3. 面向对象的JavaScript（一）命名空间

    在小项目中对于JavaScript使用,只要写几个function就行了.但在大型项目中,尤其是在开发追求良好的用户体验的网站中,如SNS,就会用到大量的JavaScrpt,有时JavaScript的 ...

  4. 一个端口操作类PortHelper

    此操作类主要使用了系统命令行来实现的,详细的命令可参照微软文档<如何使用"netsh advfirewall firewall"上下文而非“netsh firewall”上下 ...

  5. 使用win2d实现萤火虫粒子效果

    这几天我在做游戏的标题画面,需要实现随机飞舞的萤火虫.萤火虫会闪烁黄绿色的光,远近不同,并且飞出屏幕边界不久会自动飞回来. 我前一阵子用win2d写了个简单的游戏引擎(现在还是alpha阶段),用它可 ...

  6. jvisualvm远程监控jvm设置

    有些时候,需要对特定环境中的Java应用进行实时性能分析,大部分非开发和测试环境,一般都是用jvisualvm进行基本检测以最小化对系统的影响(其开启后,负载影响大约20%-30%),jvisualv ...

  7. 关于IE处理margin和padding值超出父元素高度的问题

    两个div,父div有padding值,子div有margin-top值,浏览器在解析实际父子位置关系时,他们之间的距离是父padding+子margin-top.现在把父div设置固定高度,并有意让 ...

  8. CSS布局——居中

    参考文章1.CSS布局奇淫技巧之--各种居中 2.http://www.imooc.com/article/2235 1.行内元素水平居中text-align:center对图片,按钮,文字等行内元素 ...

  9. SAP中获取当前用户相关信息的两个函数

    函数名:TH_USER_LIST作用:可以得到SM04界面显示样式的表. 函数名:TH_USER_INFO作用:可以得到当前特定用户的机器名.当前活动窗口数.IP地址等信息

  10. 安卓开发_慕课网_ViewPager实现Tab(App主界面)

    学习内容来自“慕课网” 网站上一共有4种方法来实现APP主界面的TAB方法 这里学习第一种 ViewPager实现Tab 布局文件有7个, 主界面acitivity.layout <Linear ...