<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>注册页面</title>
<link href="css/common.css" rel="stylesheet" />
<link href="css/pg-header.css" rel="stylesheet" />
<link href="css/account.css" rel="stylesheet" />
</head>
<body>
<div class="pg-header">
<div class="header-top">
<div class="account-container bg">
<ul class="top-left">
<li>*<a>收藏本站</a></li>
</ul>
<ul class="top-right">
<li><a href='/account/login'>登录</a></li>
<li><a href='/account/register'>免费注册</a></li>
<li><a href='/account/manage'>我的订单</a></li>
<li><a>VIP 会员俱乐部</a></li>
<li class="menu" onmouseover="show_menu(this);" onmouseout="hide_menu(this)">
<span>客户服务<i class="triangle down"></i></span>
<div class="hide" style="position:relative;">
<ul class="help-menu">
<li><a href="/article_cat-6/article-101.html" target="_blank" title="购买流程" rel="nofollow">购买流程</a></li>
<li><a href="/article_cat-6/article-646.html" onclick="" target="_blank" title="在线帮助" rel="nofollow">在线帮助</a></li>
</ul>
</div>
</li>
</ul>
<div class="clearfix"></div>
</div>
</div>
</div>
<div class="pg-body">
<div class='account-container'>
<div class='header clearfix'>
<div>
<a href="/home/index">
<img src="images/logo_small.png">
</a>
</div>
</div>
<div class='body clearfix'>
<div class='register left'>
<div>
<h1 class='mb20'>注册新用户</h1>
<form id='Form' method='POST' action='/account/register'>
<div class='group'>
<label class='tip'><span class="red">*</span>用户名：</label>
<input type='text' require='true' label='用户名' Field='string' range='4-40' name='username' />
<i class='i-name'></i>
</div>
<div class='group'>
<label class='tip'><span class="red">*</span>手机号：</label>
<input type='text' require='true' label='手机号' mobile='true' name='telphone' />
<i class='i-phone'></i>
</div>
<div class='group'>
<label class='tip'><span class="red">*</span>登录密码：</label>
<input type='password' require='true' label='登录密码' min-len='6' name='pwd' />
<i class='i-pwd'></i>
</div>
<div class='group'>
<label class='tip'><span class="red">*</span>确认密码：</label>
<input type='password' require='true' label='确认密码' confirm-to='pwd' name='confirmpwd' />
<i class='i-pwd'></i>
</div>
<div class='group'>
<label class='tip'><span class="red">*</span>验证码：</label>
<input type='text' require='true' label='验证码' style='80px;' name='checkcode' />
<a style='125px;display:inline-block;'><img class='checkcode' onclick='ChangeCode();' id='imgCode' src='/account/check' /></a>
</div>
<div class='group font12'>
<label class='tip'></label>
<label style='246px;display: inline-block;'>
<input id='protocol' name='protocol' type='checkbox' checked='checked' /><span>我已阅读并同意<a href='#'>《用户注册协议》</a></span>
</label>
</div>
<div class='group'>
<label class='tip'></label>
<input type='submit' class='submit' value='同意以上协议并注册' />
</div>
</form>
</div>
</div>
<div class='more left'>
<div class='mg10 font12'>我已经注册，现在就<a href='/account/login' class='ml5'>登录</a></div>
<div class='mg10 mt30'><img src="/statics/images/hongbao.jpg"></div>
</div>
</div>
</div>
</div>
<div class="pg-footer">
<div class='account-container' style='text-align:center;'>
© 2004-2015 www.autohome.com.cn All Rights Reserved. 老男孩 版权所有
</div>
</div>
<script src="js/jquery-1.8.2.min.js"></script>
<script src="js/wupeiqi.js"></script>
<script type="text/javascript">
$(function(){
$.register('#Form','');
})
function show_menu(arg) {
$(arg).find(".down").addClass("up").removeClass("down");
$(arg).find(".hide").addClass("show").removeClass("hide");
}
function hide_menu(arg) {
$(arg).find(".up").addClass("down").removeClass("up");
$(arg).find(".show").addClass("hide").removeClass("show");
}
function ChangeCode() {
var code = document.getElementById('imgCode');
code.src += '?';
}
</script>
</body>
</html>
(function(jq){
function ErrorMessage(container,msg){
$error = container.find("label[class='input-error']");
if($error.length>0){
$error.text(msg);
}else{
var temp = "<label class='input-error'>"+msg+"</label>";
container.append(temp);
}
}
function EmptyError(container){
$error = container.find("label[class='input-error']");
if($error.length>0){
$error.remove();
}
}
jq.extend({
'CheckAll':function(targetcontainer){
$(targetcontainer).find(':checkbox').attr('checked',true);
},
'UnCheckAll':function(targetcontainer){
$(targetcontainer).find(':checkbox').attr('checked',false);
},
'ReverseCheck':function(targetcontainer){
$(targetcontainer).find(':checkbox').each(function(){
var check = $(this).attr('checked');
console.log(check);
if(check){
$(this).attr('checked',false);
}else{
$(this).attr('checked',true);
}
})
},
'Hide':function(target){
$(target).addClass('hide');
},
'Show':function(target){
$(target).removeClass('hide');
},
'register':function(form,summaryStatusId){
$(form).find(':submit').click(function(){
var flag = true;
$(form).find(':text,:password').each(function(){
var name = $(this).attr('name');
var label = $(this).attr('label');
var val = $(this).val();
var $parent = $(this).parent();
//<label class='input-error'>用户名长度只能在4-20位字符之间</label>
//<label class='input-error'>用户名只能由中文、英文、数字及"-"、"_"组成</label>
var required = $(this).attr('require');
if(required){
if(!val || val.trim() == ''){
flag = false;
ErrorMessage($parent,label+'不能为空.');
return false;
}
}
var confirm_to = $(this).attr('confirm-to');
if(confirm_to){
var $original = $(form).find("input[name='"+confirm_to+"']");
if($original.val().trim()!=val.trim()){
flag = false;
ErrorMessage($parent,'两次密码输入不一致.');
return false;
}
}
var number = $(this).attr('number');
if(number){
if(!$.isNumeric(number)){
flag = false;
ErrorMessage($parent,label+'必须为数字.');
return false;
}
}
var mobile = $(this).attr('mobile');
if(mobile){
var reg = /^1[3|5|8]d{9}$/;
if(!reg.test(val)){
flag = false;
ErrorMessage($parent,label+'格式错误.');
return false;
}
}
var min = $(this).attr('min-len');
if(min){
var len = parseInt(min)
if(val.length<len){
flag = false;
ErrorMessage($parent,label+'最小长度为'+min+'.');
return false;
}
}
var max = $(this).attr('max-len');
if(max){
var len = parseInt(max)
if(val.length>len){
flag = false;
ErrorMessage($parent,label+'最大长度为'+max+'.');
return false;
}
}
var range = $(this).attr('range');
if(range){
var len = range.split('-');
if(val.length<parseInt(len[0])||val.length>parseInt(len[1])){
flag = false;
ErrorMessage($parent,label+'长度只能在'+len[0]+'-'+len[1]+'位字符之间.');
return false;
}
}
var field = $(this).attr('Field');
if(field=='string'){
var reg = /^w+$/;
if(!reg.test(val)){
flag = false;
ErrorMessage($parent,label+'只能由英文、数字及"_"组成.');
return false;
}
}
EmptyError($parent);
});
var check = $("#protocol").prop('checked');
if(!check){
flag = false;
try{
ErrorMessage($("#protocol").parent().parent(),'请阅读用户注册协议.');
}catch(e){
flag = false;
}
}else{
EmptyError($("#protocol").parent().parent());
}
return flag;
});
},
'login':function(form,summaryStatusId){
$(form).find(':submit').click(function(){
var flag = true;
$(form).find(':text,:password').each(function(){
var name = $(this).attr('name');
var label = $(this).attr('label');
var val = $(this).val();
var $parent = $(this).parent();
var required = $(this).attr('require');
if(required){
if(!val || val.trim() == ''){
flag = false;
ErrorMessage($parent,label+'不能为空.');
return false;
}
}
EmptyError($parent);
});
return flag;
});
},
});
})(jQuery)