zoukankan      html  css  js  c++  java
  • js实现CheckBox全选或者不全选

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    </head>
    <body>

    <form id="form1" runat="server">
    <div>
    <input id="Checkbox1" name="all" type="checkbox" onclick="show()"/>全选/取消
    <input id="Checkbox2" name="c1" type="checkbox" />1
    <input id="Checkbox3" name="c1" type="checkbox" />2
    <input id="Checkbox4" name="c1" type="checkbox" />3
    <input id="Checkbox6" name="c1" type="checkbox" />4
    <input id="Checkbox5" name="c1" type="checkbox" />5
    </div>
    </form>
    </body>
    <script>
    function show()
    {
    //根据名字获取所有checkbox控件
    var allCheckBoxs = document.getElementsByName("c1");

    //半段点击了全选
    if (document.getElementById("Checkbox1").checked == true) {

    //循环让所有全选
    for (var i = 0; i < allCheckBoxs.length ; i++) {
    if (allCheckBoxs[i].type == "checkbox") {
    allCheckBoxs[i].checked = true;
    }
    }
    }
    //点击了取消全选
    else {
    //循环取消全选
    for (var i = 0; i < allCheckBoxs.length ; i++) {
    if (allCheckBoxs[i].type == "checkbox") {
    allCheckBoxs[i].checked = false;
    }
    }
    }
    }
    </script>
    </html>

  • 相关阅读:
    单例模式
    Java多线程小例子(三个窗口卖火车票)
    HashMap和HashTable的区别
    javascript操作对象的方法
    javascript基本语法
    其他标签
    头标签
    label标签
    表单标签
    IO流-LineNumberReader
  • 原文地址:https://www.cnblogs.com/chaowang/p/6673335.html
Copyright © 2011-2022 走看看