zoukankan      html  css  js  c++  java
  • js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset=UTF-8>
    <title>js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中</title>
    <style type="text/css">
    </style>
    <script type="text/javascript">
        onload = function ()
        {
            var obox = document.getElementById ("box");
            var odiv = document.getElementById ("div1");
            var ach = odiv.getElementsByTagName ("input");
            obox.onclick = function ()
            {
                for ( var i = 0; i < ach.length; i++)
                {
                    ach[i].checked = this.checked;
                }
            }
             
            for ( var i = 0; i < ach.length; i++)
            {
                ach[i].onclick = function ()
                {
                    if ( !this.checked )
                    {
                        obox.checked = false;
                    }
                };
            }
        }
    </script>
    </head>
    <body>
        <label><input id="box" type="checkbox" />全选/全不选</label>
         
        <div id="div1">
            <label><input type="checkbox" />1</label><br /> 
            <label><input type="checkbox" />2</label><br />
            <label><input type="checkbox" />3</label><br />
            <label><input type="checkbox" />4</label><br />
        </div>
    </body>
    </html>

    下面是运行效果:

    js全选和一个子复选框没选则全选不选中





  • 相关阅读:
    Ocelot + IdentityServer4 坑自己
    撸一个简易商城
    visual studio2013负载测试简单问题记录
    Jquery简单动画的实现记录
    Jquery的一些简单使用记录
    图片变灰css3
    Jquery的一些取值
    ASP.NET WebApi 简单记录
    iframe的一些简单记录
    Jquery Select 下拉框处理
  • 原文地址:https://www.cnblogs.com/yangjinwang/p/6070047.html
Copyright © 2011-2022 走看看