zoukankan      html  css  js  c++  java
  • JS实现“全选”和"全不选"功能

    效果图:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <script>
    
        function clickon() {
            // 获取到body中所有checkbox
            var checkbox = document.querySelectorAll("input[type='checkbox']");
    
            for (var i = 0; i < checkbox.length; i++) {
                checkbox[i].checked = true;
            }
        }
    
        function unclick() {
            var checkbox = document.querySelectorAll("input[type='checkbox']");
    
            for (var i = 0; i < checkbox.length; i++) {
                checkbox[i].checked = false;
            }
        }
    
    </script>
    <body>
    
    <form>
        <input type="checkbox"><input type="checkbox"><input type="checkbox"><input type="checkbox"><input type="button" value="全选" onclick="clickon()">
        <input type="button" value="全不选" onclick="unclick()">
    </form>
    
    
    </body>
    </html>
  • 相关阅读:
    Java核心技术-映射
    Java核心技术-具体的集合
    Java核心技术-继承
    Spring MVC 起步
    最小化Spring XML配置
    装配Bean
    Bean和Spirng模块
    Spring入门
    git学习笔记
    CISCN2018-WP
  • 原文地址:https://www.cnblogs.com/lyd447113735/p/11757152.html
Copyright © 2011-2022 走看看