zoukankan      html  css  js  c++  java
  • js初学—实现checkbox全选功能

    布局如下:

    <p ><input type="checkbox" id="che1"/>全选</p>
    <
    div id="div1"> <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" /><br /> <input type="checkbox" /><br /> <input type="checkbox" /><br /> </div>

    javascript如下:

    <script type="text/javascript">
        window.onload=function()
        {
            xuanzhe();
        }
        function xuanzhe()//定义函数
        {
            var oChe1=document.getElementById('che1');//获取che1
            var oDiv1=document.getElementById('div1').getElementsByTagName('input');//获取div里面的所有input
    
                    oChe1.onclick=function()//定义che1的鼠标点击事件
                    {
                        
                            for(var i=0;i<oDiv1.length;i++)
                            {
                                if(che1.checked==true)
                                {
                                    oDiv1[i].checked=true;
                                }
                                else
                                {
                                    oDiv1[i].checked=false;
                                }
                            }
                    
                        
                    };
        }
    
    </script>

    能实现checkbox全选功能!  这种功能在网页是应用很广泛!

  • 相关阅读:
    945.使数组唯一的最小增量
    用两个栈实现队列
    MySQL的约束
    数据库的设计
    约束
    DQL查询
    数据库的基本概念
    SQL基础语法
    MySQL基础
    java的注解和反射
  • 原文地址:https://www.cnblogs.com/zhangans/p/3948111.html
Copyright © 2011-2022 走看看