03.1 JavaScript练习
2019-06-23 本文已影响0人
xinyaZ
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
window.onload = function(){
//获取注册的按钮对象并给它绑定单击事件
var subEle = document.getElementById("submitBtn");
subEle.onclick = function(){
//获取文本框
var userInputEle = document.getElementById("userInput");
//获取用户输入的用户名
var userInputValue = userInputEle.value;
//判断用户名是否为空
if(userInputValue == ""){
alert("用户名不能为空！");
//取消默认行为
return false;
}
//获取密码框
var pwdInputEle = document.getElementById("pwdInput");
//获取密码
var pwdInputValue = pwdInputEle.value;
//判断密码是否为空
if(pwdInputValue == ""){
alert("密码不能为空！");
//取消默认行为
return false;
}
//获取确认密码框
var confirmPwdEle = document.getElementById("confirmPwd");
//获取确认密码
var confirmPwdEleValue = confirmPwdEle.value;
//判断确认密码是否为空
if(confirmPwdEleValue == ""){
alert("确认密码不能为空！");
//取消默认行为
return false;
}
//判断两次输入的密码是否一致
if(confirmPwdEleValue != pwdInputValue){
//将确认密码置空
confirmPwdEle.value = "";
alert("两次输入的密码不一致！");
//取消默认行为
return false;
}
//获取邮箱
var emailValue = document.getElementById("emailInput").value;
if(emailValue == ""){
alert("邮箱不能为空！");
return false;
}
};
};
</script>
</head>
<body>
<h3>注册页面</h3>
<img src="../img/logo.gif"/>
<form action="regist_success.html" method="post">
<table border="1">
<tr>
<td>用户名</td>
<td><input type="text" id="userInput" name="username" /></td>
</tr>
<tr>
<td>密码</td>
<td><input type="password" id="pwdInput" name="password" /></td>
</tr>
<tr>
<td>确认密码</td>
<td><input type="password" id="confirmPwd" name="passwordConfirm" /></td>
</tr>
<tr>
<td>邮箱</td>
<td><input type="text" id="emailInput" name="email" /></td>
</tr>
<tr>
<td colspan="2" align="center"><input type="submit" id="submitBtn" value="注册" /></td>
</tr>
</table>
</form>
<br /><br />
<a href="../index.html">回首页</a>
</body>
</html>
