您的位置：首页 > Web前端 > JavaScript

用js实现163网易邮箱注册界面

2016-07-08 22:05 411 查看

用js实现163网易邮箱注册界面

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>mischen</title>
<script>
function check(frm){
var uname=frm.uname.value;
var pwd1=frm.pwd1.value;
var pwd2=frm.pwd2.value;
var fs=frm.favorite;
var fs_no=false;
var uname_ok=true;
var pwd1_ok=true;
var pwd2_ok=true;
document.getElementById("unameError").innerHTML="";
document.getElementById("pwd1Error").innerHTML="";
document.getElementById("pwd2Error").innerHTML="";
document.getElementById("favoriteError").innerHTML="";

if(uname.length<6||uname.length>18){
document.getElementById("unameError").innerHTML="长度应该是6~18";
uname_ok=false;
}
if(pwd1.length<6||uname.length>16){
document.getElementById("pwd1Error").innerHTML="密码长度应该是6~16";
pwd1_ok=false;
}
if(pwd1!=pwd2){
document.getElementById("pwd2Error").innerHTML="两次输入的密码不一致";
pwd2_ok=false;
}
for(var i=0;i<fs.length;i++){
if(fs[i].checked){
fs_no=true;
break;
}
}
if(!fs_no){
document.getElementById("favoriteError").innerHTML="请至少选择一个爱好";
}
return uname_ok&&pwd1_ok&&pwd2_ok&&fs_no;
}
</script>
</head>
<body>
<center>
<h1>163网易邮箱注册界面</h1>
<hr size="5" color="blue">
<br>
<form action="a.jsp" onsubmit="return check(this);">
* 邮件地址:<input type="text" name="uname">@
<select name="sel">
<option value="163.com" selected>163.com</option>
<option value="126.com">126.com</option>
<option value="yeah.net">yeah.net</option>
</select>
</input><br>
<div id="nameTips" class="tips" style="ime-mode:disabled;color:#999;font-weight:normal">
<span class="txt-tips">6~18个字符，可使用字母、数字、下划线，需以字母开头</span>
</div>
<span style="color:red;" id="unameError"></span></br>
* 密码:<input type="password" name="pwd1"><br>
<div style="ime-mode:disabled;color:#999;font-weight:normal">
<span class="txt-tips">6~16个字符，区分大小写</span>
</div>
<span style="color:red;" id="pwd1Error"></span></br>
* 确认密码：<input type="password" name="pwd2"><br>
<div style="ime-mode:disabled;color:#999;font-weight:normal">
<span class="txt-tips">请再次填写密码</span>
</div>
<span style="color:red;" id="pwd2Error"></span></br>
爱好：<input type="checkbox" name="favorite" value="1">唱歌
<input type="checkbox" name="favorite" value="2">跳舞
<input type="checkbox" name="favorite" value="3">游泳
<input type="checkbox" name="favorite" value="4">跑步
<span style="color:red;" id="favoriteError"></span></br>
<input type="submit" value="提交"/>
<input type="reset" value="重置"/>

</form>
</center>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航