下面的js在init
里的new
了一个对象,然后再用对象下的方法去验证对象这个有
什么作用(意义)?
$(document).ready(function() {
var Login = (function(){
var $form = $("#login-form"),
$error_tip = $("#error-tip"),
$vel_img = $("#validateImg");
function Module(){
this.urls = {
do_login: 'userLogin'
};
}
Module.prototype = {
_doLogin: function(_this, $login_btn, data){
$.ajax({
url: _this.urls.do_login,
type: 'POST',
dataType: 'json',
data: data,
success: function(response){
//成功后操作
},
error: function(){
//失败后操作
}
});
},
bindKey: function(_this){
$form.on("keyup", "input", function(event) {
event.preventDefault();
var $this = $(this), val = $.trim($this.val());
if(event.keyCode == 13){
if(_this.check_login()){
var data = $form.serialize();
_this._doLogin(_this, $this, data);
}
}
});
},
bindSubmit: function(_this){
$form.on("click", ".btn-login", function(){
var $this = $(this);
if(_this.check_login()){
var data = $form.serialize();
_this._doLogin(_this, $this, data);
}
});
}
};
Module.prototype.check_login = function(){
var $userName = $form.find("input[name='name']"),
$password = $form.find("input[name='password']"),
userName = $.trim($userName.val()),
password = $.trim($password.val());
if (userName == ""){
$error_tip.text("请输入用户名").show();
$userName.focus();
return false;
}else if(password == ""){
$error_tip.text("请输入密码").show();
$password.focus();
return false;
}
return true;
};
return {
init: function(){
var mod = new Module();
mod.bindKey(mod);
mod.bindSubmit(mod);
mod.bindValidateImgChange(mod);
}
};
})();
Login.init();
});
<form id="login-form" onsubmit="return false">
<h3>登录</h3>
<div id="error-tip">
</div>
<div class="form-group">
<label>用户名</label>
<input type="text" autocomplete="off" placeholder="请输入用户名" name="name"/>
</div>
<div class="form-group">
<label>密码</label>
<input type="password" autocomplete="off" placeholder="请输入密码" name="password"/>
</div>
<div class="form-actions">
<button type="submit" class="btn btn-login">登录</button>
</div>
</form>