HTML
<div class="head">
<h2 id="title" class="selected">Login</h2>
</div>
<div class="content">
<form name="loginForm" >
<div id="user-name-label" class="show">User name</div>
<input id="username" name="username" type="name">
<div id="psw-label">Password</div>
<input id="psw" name="password" type="password">
<div id="psw-confirm-label" class="hide">Confirm password</div>
<input id="psw-confirm" class="hide" name="passwordConfirm" type="password">
<input type="submit">
<input type="reset">
</form>
</div>
<a id="register-lik">Not a user? Register</a>
<a id="login-link" class="hide">Login</a>
JAVASCRIPT
var head = document.getElementById('head');
var pswConfirmLabel = document.getElementById('psw-confirm-label');
var pswConfirmInput = document.getElementById('psw-confirm');
var isLogin = true;
function submit() {
if (isLogin) {
login();
} else {
register();
}
}
function login() {
if(!checkLogin()) return;
// send out request to login.
}
function register() {
if(!checkRegister()) return;
// send out request to register.
}
function checkLogin() {
if(checkUsername() && checkPassword()){
return true;
}
return false;
}
function checkRegister() {
if(checkUsername() && checkPassword() && checkPasswordConfirm()){
return true;
}
return false;
}
function checkUsername(){
var username = document.loginForm.username;
if(username.value.length != 0){
return true;
}else{
alert("请输入用户名");
return false;
}
}
//检查登录密码
function checkPassword(){
var password = document.loginForm.password;
if(password.value.length != 0){
return true;
}else{
alert("请输入密码");
return false;
}
}
function checkPasswordConfirm(){
var password = document.loginForm.passwordConfirm;
if(password.value.length != 0){
return true;
}else{
alert("请确认密码");
return false;
}
}
function toRegister() {
isLogin = true;
pswConfirmLabel.className = '';
pswConfirm.className = '';
}
function toLogin() {
isLogin = false;
pswConfirmLabel.className = 'hide';
pswConfirm.className = 'hide';
}
