zoukankan      html  css  js  c++  java
  • 原生JavaScript练习——全选

    HTML:

        <label ><input id="all" type="checkbox">全选</label>
        <hr>
        <input type="checkbox">魅族<br>
        <input type="checkbox">小米<br>
        <input type="checkbox">华为<br>
        <input type="checkbox">一加<br>
        <input type="checkbox">苹果<br>
        <input type="checkbox">三星<br>
        <input type="checkbox">努比亚<br>
        <input type="checkbox">OPPO<br>
        <input type="checkbox">Vivo<br>

    Javasript:

    window.onload = function () {
    // 获取全选按钮
                var all = document.getElementById('all');
    // 添加点击事件
                all.onclick = function () {
                    var boxs = document.getElementsByTagName('input');
    // 遍历所有input标签
                    for(var i = 0 ; i < boxs.length ; i++){
    // 使全选按钮的选中状态与其他所有input标签状态一致
                        boxs[i].checked = all.checked;
                    }
                }
            }
  • 相关阅读:
    PHP面试题4
    php面试题2
    php基础面试题1
    mysql添加索引命令
    lnmp初步学习知识整理
    代码运行的自由
    Lein droid
    关于Domain Sepcific Lang
    JavaScript倒计时类
    三国小记
  • 原文地址:https://www.cnblogs.com/luohaoran/p/5919455.html
Copyright © 2011-2022 走看看