<form id="personRegForm" method="post" οnsubmit="return false;">
<div class="form" onselectstart="return false;">
<div class="item" id="select-regName">
<span class="label"><b class="ftx04">*</b>用户名:</span>
<div class="fl item-ifo">
<div class="o-intelligent-regName">
<input type="text" id="regName" name="username" class="text" tabindex="1" autoComplete="off"
οnpaste="return false;"
value=""
οnfοcus="if(this.value=='') this.value='';this.style.color='#333'"
οnblur="if(this.value=='') {this.value='';this.style.color='#999999'}"/>
<i class="i-name"></i>
<ul id="intelligent-regName" class="hide"></ul>
<label id="regName_succeed" class="blank"></label>
<label id="regName_error" class="hide"></label>
</div>
</div>
</div>
<div id="o-password">
<div class="item">
<span class="label"><b class="ftx04">*</b>请设置密码:</span>
<div class="fl item-ifo">
<input type="password" id="pwd" name="password" class="text" tabindex="2"
style="ime-mode:disabled;"
οnpaste="return false" autocomplete="off"/>
<i class="i-pass"></i>
<label id="pwd_succeed" class="blank"></label>
<label id="pwd_error"></label>
<span class="clr"></span>
</div>
</div>
<div class="item">
<span class="label"><b class="ftx04">*</b>请确认密码:</span>
<div class="fl item-ifo">
<input type="password" id="pwdRepeat" name="pwdRepeat" class="text" tabindex="3"
οnpaste="return false" autocomplete="off"/>
<i class="i-pass"></i>
<label id="pwdRepeat_succeed" class="blank"></label>
<label id="pwdRepeat_error"></label>
</div>
</div>
<div class="item" id="dphone">
<span class="label"><b class="ftx04">*</b>验证手机:</span>
<div class="fl item-ifo">
<input type="text" id="phone" maxlength="11" name="phone"
class="text" tabindex="4"
autocomplete="off" /> <i class="i-phone"></i> <label
id="phone_succeed" class="blank"></label> <label
id="phone_error"></label>
</div>
</div>
</div>
<div class="item item-new">
<span class="label"> </span>
<div class="fl item-ifo">
<input type="checkbox" class="checkbox" checked="checked" id="readme"
οnclick="agreeonProtocol();">
<label for="protocol">我已阅读并同意<a href="#" class="blue" id="protocol">《****用户注册协议》</a></label>
<span class="clr"></span>
<label id="protocol_error" class="error hide">请接受服务条款</label>
</div>
</div>
<div class="item">
<span class="label"> </span>
<input type="button" class="btn-img btn-regist" id="registsubmit" value="立即注册" tabindex="8"
clstag="regist|keycount|personalreg|07"
οnclick="ZHUECE.zc();"/>
</div>
</div>
</form>
<script type="text/javascript">
//或得焦点
$(".text").focus(function(){
$(this).css("background-color","#FFFFCC");
});
//失去焦点
$(".text").blur(function(){
$(this).css("background-color","");
});
//对象
var ZHUECE={
param:{
//单点登录系统的url 本系统内 非本系统加地址 如http://localhost:8081/
surl:""
},
inputcheck:function(){
//不能为空检查
if ($("#regName").val() == "") {
alert("用户名不能为空");
$("#regName").focus();
return false;
}
if ($("#pwd").val() == "") {
alert("密码不能为空");
$("#pwd").focus();// 获取焦点 改变背景色
return false;
}
if ($("#phone").val() == "") {
alert("手机号不能为空");
$("#phone").focus();
return false;
}
//密码检查
if ($("#pwd").val() != $("#pwdRepeat").val()) {
alert("确认密码和密码不一致,请重新输入!");
$("#pwdRepeat").select();
$("#pwdRepeat").focus();
return false;
}
return true;
},
beforeSubmit:function() {
//检查用户是否已经被占用
$.ajax({
//escape() 函数可对字符串进行编码,这样就可以在所有的计算机上读取该字符串。
url : ZHUECE.param.surl + "/user/check/"+escape($("#regName").val())+"/1?r=" + Math.random(),
success : function(data) {
if (data.data) {
//检查手机号是否存在
$.ajax({
url : ZHUECE.param.surl + "/user/check/"+$("#phone").val()+"/2?r=" + Math.random(),
success : function(data) {//返回响应值 data.data 值是boolean
if (data.data) {
ZHUECE.doSubmit();
} else {
alert("此手机号已经被注册!");
$("#phone").select();
}
}
});
} else {
alert("此用户名已经被占用,请选择其他用户名");
$("#regName").select();
}
}
});
},
doSubmit:function() {
//serialize() 方法通过序列化表单值,创建 URL 编码文本字符串。
$.post("/user/register",$("#personRegForm").serialize(), function(data){
if(data.status == 200){
alert('用户注册成功,请登录!');
ZHUECE.login();
} else {
alert("注册失败!");
}
});
},
login:function() {
location.href = "/user/showLogin";
return false;
},
zc:function() {
if (this.inputcheck()) {
this.beforeSubmit();
}
}
};
</script>
<div class="form" onselectstart="return false;">
<div class="item" id="select-regName">
<span class="label"><b class="ftx04">*</b>用户名:</span>
<div class="fl item-ifo">
<div class="o-intelligent-regName">
<input type="text" id="regName" name="username" class="text" tabindex="1" autoComplete="off"
οnpaste="return false;"
value=""
οnfοcus="if(this.value=='') this.value='';this.style.color='#333'"
οnblur="if(this.value=='') {this.value='';this.style.color='#999999'}"/>
<i class="i-name"></i>
<ul id="intelligent-regName" class="hide"></ul>
<label id="regName_succeed" class="blank"></label>
<label id="regName_error" class="hide"></label>
</div>
</div>
</div>
<div id="o-password">
<div class="item">
<span class="label"><b class="ftx04">*</b>请设置密码:</span>
<div class="fl item-ifo">
<input type="password" id="pwd" name="password" class="text" tabindex="2"
style="ime-mode:disabled;"
οnpaste="return false" autocomplete="off"/>
<i class="i-pass"></i>
<label id="pwd_succeed" class="blank"></label>
<label id="pwd_error"></label>
<span class="clr"></span>
</div>
</div>
<div class="item">
<span class="label"><b class="ftx04">*</b>请确认密码:</span>
<div class="fl item-ifo">
<input type="password" id="pwdRepeat" name="pwdRepeat" class="text" tabindex="3"
οnpaste="return false" autocomplete="off"/>
<i class="i-pass"></i>
<label id="pwdRepeat_succeed" class="blank"></label>
<label id="pwdRepeat_error"></label>
</div>
</div>
<div class="item" id="dphone">
<span class="label"><b class="ftx04">*</b>验证手机:</span>
<div class="fl item-ifo">
<input type="text" id="phone" maxlength="11" name="phone"
class="text" tabindex="4"
autocomplete="off" /> <i class="i-phone"></i> <label
id="phone_succeed" class="blank"></label> <label
id="phone_error"></label>
</div>
</div>
</div>
<div class="item item-new">
<span class="label"> </span>
<div class="fl item-ifo">
<input type="checkbox" class="checkbox" checked="checked" id="readme"
οnclick="agreeonProtocol();">
<label for="protocol">我已阅读并同意<a href="#" class="blue" id="protocol">《****用户注册协议》</a></label>
<span class="clr"></span>
<label id="protocol_error" class="error hide">请接受服务条款</label>
</div>
</div>
<div class="item">
<span class="label"> </span>
<input type="button" class="btn-img btn-regist" id="registsubmit" value="立即注册" tabindex="8"
clstag="regist|keycount|personalreg|07"
οnclick="ZHUECE.zc();"/>
</div>
</div>
</form>
<script type="text/javascript">
//或得焦点
$(".text").focus(function(){
$(this).css("background-color","#FFFFCC");
});
//失去焦点
$(".text").blur(function(){
$(this).css("background-color","");
});
//对象
var ZHUECE={
param:{
//单点登录系统的url 本系统内 非本系统加地址 如http://localhost:8081/
surl:""
},
inputcheck:function(){
//不能为空检查
if ($("#regName").val() == "") {
alert("用户名不能为空");
$("#regName").focus();
return false;
}
if ($("#pwd").val() == "") {
alert("密码不能为空");
$("#pwd").focus();// 获取焦点 改变背景色
return false;
}
if ($("#phone").val() == "") {
alert("手机号不能为空");
$("#phone").focus();
return false;
}
//密码检查
if ($("#pwd").val() != $("#pwdRepeat").val()) {
alert("确认密码和密码不一致,请重新输入!");
$("#pwdRepeat").select();
$("#pwdRepeat").focus();
return false;
}
return true;
},
beforeSubmit:function() {
//检查用户是否已经被占用
$.ajax({
//escape() 函数可对字符串进行编码,这样就可以在所有的计算机上读取该字符串。
url : ZHUECE.param.surl + "/user/check/"+escape($("#regName").val())+"/1?r=" + Math.random(),
success : function(data) {
if (data.data) {
//检查手机号是否存在
$.ajax({
url : ZHUECE.param.surl + "/user/check/"+$("#phone").val()+"/2?r=" + Math.random(),
success : function(data) {//返回响应值 data.data 值是boolean
if (data.data) {
ZHUECE.doSubmit();
} else {
alert("此手机号已经被注册!");
$("#phone").select();
}
}
});
} else {
alert("此用户名已经被占用,请选择其他用户名");
$("#regName").select();
}
}
});
},
doSubmit:function() {
//serialize() 方法通过序列化表单值,创建 URL 编码文本字符串。
$.post("/user/register",$("#personRegForm").serialize(), function(data){
if(data.status == 200){
alert('用户注册成功,请登录!');
ZHUECE.login();
} else {
alert("注册失败!");
}
});
},
login:function() {
location.href = "/user/showLogin";
return false;
},
zc:function() {
if (this.inputcheck()) {
this.beforeSubmit();
}
}
};
</script>