java-script简单语法练习-第四天_java script 第四天作业答案-CSDN博客

本文链接：https://blog.csdn.net/qq_34734520/article/details/51570514

运用web-storm开发

1.登录简单登录页面的实现与设置

2.有一个不完善地方，每次判断不通过应加上返回false；

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script>
        var ifEmail=false;
        var ifName=false;
        var ifPwd=false;
        var ifPwd1=false;
        function checkemail(){//检查email输入
            var objEmail=$$("txtEmail");//获取email
            if(objEmail.value.trim().length==0){


                $$("info").innerHTML="*Email不能为空";
            }else{
                var patterSpace=/\s+/;
                if(patterSpace.test(objEmail.value.trim())){
                    $$("info").innerHTML="*Email不能包含空格";
                }else{
                    var regpatter=/^\w+@\w+\.((com)|(cn)|(com\.cn))$/;
                    if(regpatter.test(objEmail.value.trim())){
                        ifEmail=true;
                        $$("info").innerHTML="<img src=\"images/register_write_ok.gif\"/>";
                    }else{
                        $$("info").innerHTML="*输入email格式不对";
                    }
                }
            }
        }//检查用户名输入
        function checkName(){
            var objName=$$("txtName");
            if(objName.value.trim().length==0){
                $$("info1").innerHTML="*用户名不能为空";
            }else{
                var patterSpace=/\s+/;
                if(patterSpace.test(objName.value.trim())){
                  $$("info1").innerHTML="*用户名不能包含空格";
                }else{
                    ifName=true;
                    $$("info1").innerHTML="<img src=\"images/register_write_ok.gif\"/>";
                }
            }
        }//检查密码输入
        function checkPwd(){
            var objPwd=$$("txtPwd");
            if(objPwd.value.trim().length==0){
                $$("info2").innerHTML="*密码不能为空";
            }else{
                var patterSpace=/\s+/;
                if(patterSpace.test(objPwd.value.trim())){
                    $$("info2").innerHTML="*密码中不能含有空格";
                }else{

                    var patter1=/^[0-9]*$/;
                    if(patter1.test(objPwd.value.trim())){
                        $$("info2").innerHTML="*不能全为数字";
                    }
                    else {
                        var patter2=/^[a-zA-Z]+$/;
                        if(patter2.test(objPwd.value.trim())) {
                            $$("info2").innerHTML = "*不能全为字母";
                        }
                        else {
                            ifPwd = true;
                            $$("info2").innerHTML = "<img src=\"images/register_write_ok.gif\"/>";
                        }
                    }
                    }
                }

        }
        function checkPwd1(){
            var objPwd1=$$("txtPwd1");
            if(objPwd1.value.trim().length==0){
                $$("info3").innerHTML="*密码不能为空";
            }else{
                var patterSpace=/\s+/;
                if(patterSpace.test(objPwd1.value.trim())){
                  $$("info3").innerHTML="*密码中不能包含空格";
                }else{
                    var objpwd=$$("txtPwd");
                    if(objpwd.value.trim()==objPwd1.value.trim()){
                      ifPwd1=true;
                        $$("info3").innerHTML="<img src=\"images/register_write_ok.gif\"/>";
                    }else{
                        $$("info3").innerHTML="*两次密码不一致,请重新输入";
                    }
                }
            }
        }
        window.οnlοad=function(){
            selectDefault=$$("selectCity").children[0];
        }
        function changecity(obj){
            var selectValue=obj.value;
            $$("selectArea").options.length=0;
            switch (selectValue){
                case "1":
                        $$("selectArea").appendChild(selectDefault);
                    break;
                case "2":
                        var chengdu=new Array("金牛区");
                        for(var i=0;i<chengdu.length;i++){
                            var getArea=chengdu[i];
                            var createElement=document.createElement("option");
                            createElement.innerText=getArea;
                            $$("selectArea").appendChild(createElement);
                        }
                    break;
                case "3":
                        var chongqing=new Array("渝中区");
                        for(var i=0;i<chongqing.length;i++){
                            var getArea=chongqing[i];
                            var createElement=document.createElement("option");
                            createElement.innerText=getArea;
                            $$("selectArea").appendChild(createElement);
                        }
                    break;
                case "4":
                        var beijing=new Array("昌平区");
                        for(var i=0;i<beijing.length;i++){
                            var getArea=beijing[i];
                            var createElement=document.createElement("option");
                            createElement.innerText=getArea;
                            $$("selectArea").appendChild(createElement);
                        }
                    break;
                default :
                    break;
            }
        }
        function $$(id){
            return document.getElementById(id);
        }
        function checkInfo(){
            if(ifEmail&&ifName&&ifPwd&&ifPwd1){
                return true;
            }else{
                return false;
            }
        }
    </script>
</head>
<body>
    <form name="form1" action="regddw.html">
    Email地址:<input type="text" οnblur="checkemail()" name="txtEmail" id="txtEmail"><span id="info" style="color: red"></span><br>
    设置昵称:<input type="text"  οnblur="checkName()" name="txtName" id="txtName"><span id="info1" style="color: red"></span><br>
    设置密码:<input type="password" οnblur="checkPwd()" name="txtPwd" id="txtPwd"><span id="info2" style="color: red"></span></em><br>
    再一次输入密码:<input type="password" οnblur="checkPwd1()" name="txtPwd1" id="txtPwd1"><span id="info3" style="color: red"></span></em><br>
    性别:<input type="radio" name="sex">男<input type="radio" name="sex">女<br>
    所在地区
     <select name="selectCity" id="selectCity" οnchange="changecity(this)">
         <option value="1">--请选择所在城市--</option>
         <option value="2">成都</option>
         <option value="3">重庆</option>
         <option value="4">北京</option>
     </select>
    <select name="selectArea" id="selectArea">
        <option value="1">--请选择所在地区--</option>
    </select><br>
    <input type="submit" value="提交注册"  οnclick="return checkInfo()">
    </form>
</body>
</html>