web二级综合应用题（用户注册）

wawa0611

已于 2023-08-18 16:09:19 修改

阅读量81

点赞数

文章标签： html javascript

于 2023-08-18 16:09:00 首次发布

本文链接：https://blog.csdn.net/weixin_47475151/article/details/132363146

版权

实现一个用户注册页面(如下图所示)，要求在点击提交按钮时验证输入内
容的有效性，点击重置按钮后，页面清空(其中学历和地区有缺省值)。

<html>
<head>  
<title>注册界面</title>  
<script language="JavaScript">  
    function isValidate(form)  
    {  
          
        userpass = form.userpass.value; 
	userpass2 = form.userpass2.value;  
        birthday = form.birthday.value;  
        email = form.email.value;  

/* ********FOUND********* */
        if(userpass != userpass2)  
        {  
            alert("两次输入的口令不相同！");
	    form.userpass.focus();
	    return false;  
        }  
          
/* ********FOUND********* */
        if(!isDate(birthday))  
        {  
            alert("生日的格式不正确！");  
            form.birthday.focus();  
            return false;  
        }  
          
/* ********FOUND********* */
        if(!isEmail(email))  
        { 
	    alert("Email格式不正确！");  
            form.email.focus();  
            return false;  
        }  
        // 验证电话号码的格式是否正确  
    }  


      
    function isNumber(str)  
    {  
        for(i=0;i<str.length;i++)  
        {  
            // 如果要判断小数，需要判断小数点  
            if(str.charAt(i)>='0' && str.charAt(i)<='9' 
			|| str.charAt(i)=="-" && i==0)  
                continue;  
            else  
                return false;  
        }  
        return true;  
    }  
      
    function isDate(date)  
    {  
        // 查找分隔符
		index1 = date.indexOf("-");  
        // 如果分隔符不存在，则不是合法的时间  
        if(index1 == -1)  
            return false;  
        // 获取时间中的年  
        year = date.substring(0,index1);  
        // 获取时间中的剩下部分  
        date = date.substring(index1+1);  
        // 查找第二个分隔符  
        index1 = date.indexOf("-");  
        // 如果不存在第二个分隔符，则不是合法的时间
		if(index1 == -1)  
            return false;  
        // 获取时间中的月份  
        month = date.substring(0,index1);  
        // 获取时间中的日  
        day = date.substring(index1+1);  
        // 判断是否是数字，如果不是则不是合法的时间  
        if(isNumber(year) && isNumber(month) && isNumber(day))  
        {  
            // 判断基本范围  
            if(year<1900 || year>9999 || month<1 || month >12 || day<1) 
			return false;  
            // 判断31天的月  
            if((month==1 || month==3 || month==5 || month==7  
            || month==8 || month==10 || month==12) && day>31)  
                return false;  
            // 判断30天的月  
            if((month==4 || month==6 || month==9 || month==11)  
                && day>30)  
                return false;  
            // 如果是2月，判断是否为润年  
            if(month==2)  
            {
		if(year%400==0 || (year%4==0 && year%100!=0))  
                {  
                    if(day>29)  
                        return false;  
                }else  
                {  
                    if(day>28)  
                        return false;  
                }  
            }
		}  
        else  
            return false;  
        return true;  
    }  
    // 判断是否是Email  
    function isEmail(email)  
    {  
        if(email.length==0)  
            return false;  
        index1 = email.indexOf('@');  
        index2 = email.indexOf('.');
		if(index1 < 1              // @符号不存在，或者在第一个位置  
        || index2 < 1          // .符号不存在，或者在第一个位置  
        || index2-index1 <2    // .在@的左边或者相邻  
        || index2+1 == email.length) // .符号后面没有东西  
            return false  
        else  
            return true;  
    }  
</script>  
</head>  
<body>  
<h2 align="center">请注册</h2>  
<!-- ********FOUND********* -->
<form name="form1" onsubmit="isValidate(this)">  
<table align="center">  
<tr><td> 用户名：</td><td><input type="text" name="userid" value="zhangsan"></td></tr>  
<!-- ********FOUND********* -->
<tr><td> 口令：</td><td><input type="password" name="userpass"></td></tr>
<!-- ********FOUND********* -->
<tr><td> 确认口令：</td><td><input type="password" name="userpass2"></td></tr>  
   <tr><td> 生日：</td><td><input type="text" name="birthday" >格式为：1988-1-1</td></tr>  
   <tr><td> 学历：</td><td>  
    <input type="radio" name="xueli" value="专科">专科  
<!-- ********FOUND********* -->
    <input type="radio" name="xueli" value="本科" checked>本科 
    <input type="radio" name="xueli" value="硕士研究生">硕士研究生  
    <input type="radio" name="xueli" value="博士研究生">博士研究生  
    <input type="radio" value="其他">其他</td></tr>  
   <tr><td> 地区：</td><td>  
<!-- ********FOUND********* -->
   <select>  
		<option value="华东">华东</option> 
		<option value="华南">华南</option>  
		<option value="华北">华北</option>  
<!-- ********FOUND********* -->
		<option value="东北" selected>东北</option>  
		<option value="东南">东南</option>  
		<option value="西南">西南</option>  
		<option value="西北">西北</option>  
		<option value="华中">华中</option>  
<!-- ********FOUND********* -->
    </select></td></tr>  
   <tr><td> E-mail:</td><td><input type="text" name="email"></td></tr> 
   <tr><td> 备注：</td><td>  
<!-- ********FOUND********* -->
   <textarea rows="8" cols="40" value="1222222"></textarea></td></tr> 
<!-- ********FOUND********* -->
   <tr><td> <input type="reset" value="重置"></td><td>  
<!-- ********FOUND********* -->
   <input type="submit" value="提交"></td></tr>  
   </table>  
</form>  
</body>  
</html>