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全选和一个子复选框没选则全选不选中





 

posted @ 2016-11-16 16:19  秋香姑娘请你不要紧张  阅读(334)  评论(0编辑  收藏  举报