zoukankan      html  css  js  c++  java
  • JavaScript小例子:复选框全选

     

    JavaScript小例子:复选框全选

      这只是一个小例子,很简单,但是这个功能还是很常用的:

      实现后效果如图:

      

      JavaScript代码:

        <script type="text/javascript">
        function selectAll()
        {
            var allMails = document.getElementsByName("allMails")[0];
            var mails = document.getElementsByName("email");
            
            if(allMails.checked)
            {
                for(var i = 0; i < mails.length; ++i)
                {
                    mails[i].checked = true;
                }    
                
            }
            else            
            {
                for(var i = 0; i < mails.length; ++i)
                {
                    mails[i].checked = false;
                }    
            }
            
        }
        </script>

      JSP页面:

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    <%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
    %>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
    
        <script type="text/javascript">
        function selectAll()
        {
            var allMails = document.getElementsByName("allMails")[0];
            var mails = document.getElementsByName("email");
            
            if(allMails.checked)
            {
                for(var i = 0; i < mails.length; ++i)
                {
                    mails[i].checked = true;
                }    
                
            }
            else            
            {
                for(var i = 0; i < mails.length; ++i)
                {
                    mails[i].checked = false;
                }    
            }
            
        }
        </script>
    
      </head>
      
      <body>
        全选<input type="checkbox" onclick="selectAll()" name="allMails"><br><br><br>
        <input type="checkbox" name="email"><br>
        <input type="checkbox" name="email"><br>
        <input type="checkbox" name="email"><br>
        <input type="checkbox" name="email"><br>
        <input type="checkbox" name="email"><br>
        <input type="checkbox" name="email"><br>
        <input type="checkbox" name="email"><br>
      </body>
    </html>

    参考资料

      圣思园张龙老师Java Web培训视频。

  • 相关阅读:
    java中的注解
    jQuery中的pushStack
    jenkins+maven+svn构建项目,及远程部署war包到tomcat上
    mysql中的find_in_set的使用
    svn的使用总结
    poi导出excel,以字符串格式输出数字
    eclipse中在整个工程中查找一个字符串的步骤
    Android Service学习
    Android生成签名文件
    开源移动医疗应用框架:mHealhDroid及APP
  • 原文地址:https://www.cnblogs.com/mengdd/p/3151073.html
Copyright © 2011-2022 走看看