<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript">
            function checkAll() {
                //先取到输入的数据
                var username = document.getElementById("username").value;
                //验证
                //在js中使用正则表达式，如果要匹配完整的字符串，需要加上标志
                //位置：
                //^     开头
                //$     结尾
                
                //i 模式，忽略大小写。
                var regex = new RegExp("^[A-Z]\\w{5,31}$","i");
                //test（被检测的字符串）

                if(!regex.test(username)) {
                    alert("用户名不合法");
                    return false;
                }

                var pwd = document.getElementById("password").value;

                //模式
                var pwdRex = /^[a-zA-Z]\w{5,31}$/g;
                if(!pwdRex.test(pwd)) {
                    alert("密码不合法");
                    return false;
                }

                return true;
            }
        </script>
    </head>

    <!--     
        描述：
        
        需要在表单提交之前，验证输入的数据是否符合要求
        
        创建正则表达式对象
        // 方式一
        var regex = new RegExp("正则表达式", "标志");
        // 方式二
        var regex = /正则表达式/标志
         标志：g    global，检测全局
              i    忽略大小写
              
        注意：
            new Regex()  需要使用转义字符 \
            /正则表达式/标志   去掉转义字符 \

    -->

    <body>
        <form action="二级菜单.html" method="get" οnsubmit="return checkAll()">
            <!--
                账号：6 ~ 32  数字字母
                密码：6 ~ 32  数字字母
            -->
            <input type="text" placeholder="账号" id="username" /><br />
            <input type="password" placeholder="密码" id="password" /><br />
            <input type="submit" value="登陆" /><br />
        </form>
    </body>

</html>