初始版本
This commit is contained in:
42
statics/resources/v7/css/phone_validate.css
Executable file
42
statics/resources/v7/css/phone_validate.css
Executable file
@@ -0,0 +1,42 @@
|
||||
/*reset*/
|
||||
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,button,blockquote,th,td {margin:0;padding:0;}
|
||||
table{border-collapse:collapse;border-spacing:0;}
|
||||
fieldset,
|
||||
img{border:0;}
|
||||
address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal;}
|
||||
li{list-style:none;}
|
||||
caption,th{text-align:left;}
|
||||
h1,h2,h3,h4,h5,h6 {font-size:100%;}
|
||||
q:before,q:after {content:'';}
|
||||
abbr,acronym{border:0;font-variant:normal;}
|
||||
sup{vertical-align:text-top;}
|
||||
sub{vertical-align:text-bottom;}
|
||||
input,textarea,select {font-family:inherit;font-size:inherit;font-weight:inherit;}
|
||||
input,textarea,select{*font-size:100%;}
|
||||
legend{color:#000;}
|
||||
/* common */
|
||||
body{font: 12px/1.5 \5b8b\4f53;color:#555;}
|
||||
.hide{display: none;}
|
||||
|
||||
.ui-btn { display: inline-block; padding: 0 13px; *padding:0; height: 28px; border: 1px solid #c1c1c1; border-radius: 2px; box-shadow: 0 1px 1px rgba(0,0,0,0.15); background: #fff; background: -moz-linear-gradient(top, #fff, #f4f4f4); background: -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#f4f4f4)); background: -o-linear-gradient(top, #fff, #f4f4f4);background: -ms-linear-gradient(top, #fff 0%,#f4f4f4 100%); background: linear-gradient(top, #fff, #f4f4f4); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f4f4f4'); font: 14px/2 \5b8b\4f53; color: #555; vertical-align: middle; cursor: pointer; }
|
||||
.ui-btn:hover {filter:progid:DXImageTransform.Microsoft.Gradient(enabled=false); background: #f4f4f4; color: #555; }
|
||||
.ui-btn:active { background: #fbfbfb; background: -moz-linear-gradient(top, #e8e8e8, #fbfbfb); background: -webkit-gradient(linear, 0 0, 0 100%, from(#e8e8e8), to(#fbfbfb)); background: -o-linear-gradient(top, #e8e8e8, #fbfbfb); background: -ms-linear-gradient(top, #e8e8e8 0%,#fbfbfb 100%); background: linear-gradient(top, #e8e8e8, #fbfbfb); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e8e8e8', endColorstr='#fbfbfb');}
|
||||
.ui-btn-dis, .ui-btn-dis:hover, .ui-btn-dis:active { text-shadow: none; font-weight: normal; border: 1px solid #d4d4d4; background: #f4f4f4; background: -moz-linear-gradient(top, #fff, #f4f4f4); background: -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#f4f4f4)); background: -o-linear-gradient(top, #fff, #f4f4f4); background: -ms-linear-gradient(top, #fff 0%,#f4f4f4 100%); background: linear-gradient(top, #fff, #f4f4f4); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f4f4f4');color: #aaa; cursor: default; }
|
||||
|
||||
.ui-btn-blue { padding: 0 16px; border: 1px solid #3279a0; box-shadow: 0 1px 1px rgba(0,0,0,0.3); background: #337fa9; background: -moz-linear-gradient(top, #4994be, #337fa9); background: -webkit-gradient(linear, 0 0, 0 100%, from(#4994be), to(#337fa9)); background: -o-linear-gradient(top, #4994be, #337fa9); background: -ms-linear-gradient(top, #4994be 0%,#337fa9 100%); background: linear-gradient(top, #4994be, #337fa9); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4994be', endColorstr='#337fa9');font-weight: bold; color: #fff; text-shadow: 0 2px 2px rgba(0,0,0,0.22); }
|
||||
.ui-btn-blue:hover { background: #3286b4; color: #fff; }
|
||||
.ui-btn-blue:active { background: -moz-linear-gradient(top, #2b6c90, #4994be); background: -webkit-gradient(linear, 0 0, 0 100%, from(#2b6c90), to(#4994be)); background: -o-linear-gradient(top, #2b6c90, #4994be); background: -ms-linear-gradient(top, #2b6c90 0%,#4994be 100%); background: linear-gradient(top, #2b6c90, #4994be); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#2b6c90', endColorstr='#4994be');}
|
||||
|
||||
.ui-input {*margin-right:5px; padding: 6px 5px; width: 180px; height: 16px; line-height: 16px; border: 1px solid #ddd; color: #555; vertical-align: middle; outline: none; }
|
||||
.ui-input-def { color: #aaa; }
|
||||
.ui-input:hover { border: 1px solid #ccc; box-shadow: 0 1px 1px #ddd; }
|
||||
.ui-input:focus, .ui-input-focus { border: 1px solid #aaa; box-shadow: 0 2px 1px rgba(0,0,0,0.11) inset; }
|
||||
|
||||
.mod-form li{padding:5px 0;}
|
||||
.mod-form li label{display: block;margin-bottom: 10px;font-weight: bold;}
|
||||
.tip{color:#999;}
|
||||
.tip-correct{color: #689800;}
|
||||
.tip-error,.set-result{color: #dd4e4e;}
|
||||
|
||||
.success h3{margin-bottom: 20px;;font-size:16px;}
|
||||
.success ul li{padding: 5px;}
|
||||
161
statics/resources/v7/js/checkPassword.js
Executable file
161
statics/resources/v7/js/checkPassword.js
Executable file
@@ -0,0 +1,161 @@
|
||||
/**
|
||||
*密码检测
|
||||
*@param {String, Object} 密码输入框的选择符
|
||||
*@param {Object} 参数设置
|
||||
*/
|
||||
var checkPassword = function(obj,cfg){
|
||||
typeof obj == 'string' ? (this.obj = $(obj)) : (this.obj = obj);
|
||||
var def_cfg = {
|
||||
error_cls : ['tip_error'],
|
||||
correct_cls : ['tip_correct'],
|
||||
lowest_level : 5,
|
||||
tips : ['#password_tip'], //tip元素的选择符
|
||||
strength : '#pwdStrTip', //显示密码强度的元素
|
||||
if_show : false //是否显示密码强度
|
||||
};
|
||||
cfg = cfg || {};
|
||||
this.cfg = $.extend({},def_cfg,cfg);
|
||||
this.init();
|
||||
};
|
||||
|
||||
checkPassword.reg = {
|
||||
nums : /^\d+$/, //纯数字
|
||||
letters : /^[a-zA-Z]+$/, //纯字母
|
||||
space : /[\u0020\uA1A1\u3000]/, //存在空格符
|
||||
chinese : /[\u4E00-\u9FA5]/, //存在中文
|
||||
num : /\d/, //存在数字
|
||||
letter : /[a-zA-Z]/, //存在字母
|
||||
special : /[^a-zA-Z0-9]/ //存在特殊符
|
||||
};
|
||||
|
||||
checkPassword.txt = ['请输入密码',
|
||||
'长度8~20位,同时包含数字、字母(区分大小写),可使用特殊符号',
|
||||
'长度8~20位,同时包含数字、字母(区分大小写),可使用特殊符号',
|
||||
'密码不能包含中文',
|
||||
'密码必须同时包含数字、字母(区分大小写),可使用特殊符号',
|
||||
'',
|
||||
''] ;//每个密码级别的提示语
|
||||
|
||||
/**
|
||||
*阻止空格符输入(结合keypress使用)
|
||||
*/
|
||||
checkPassword.blockSpace = function(_event){
|
||||
if(_event.keyCode){
|
||||
var char = String.fromCharCode(_event.keyCode);
|
||||
}else{
|
||||
var char = String.fromCharCode(_event.charCode);
|
||||
}
|
||||
return !checkPassword.reg.space.test(char);
|
||||
};
|
||||
|
||||
/**
|
||||
*检测密码强度
|
||||
*@param {String, Number} 密码
|
||||
*/
|
||||
checkPassword.level = function(val){
|
||||
//密码为空时返回0
|
||||
//密码小于8位或大于20位时返回1
|
||||
//密码包含空格符时返回2
|
||||
//密码包含中文时返回3
|
||||
//密码为纯数字或纯字母时为4
|
||||
//密码为数字+字母时为5
|
||||
//密码为数字、字母、特殊符号组合时为6
|
||||
if(val.length == 0) return 0;
|
||||
if(val.length < 8 || val.length > 20) return 1;
|
||||
if(checkPassword.reg.space.test(val)) return 2;
|
||||
if(checkPassword.reg.chinese.test(val)) return 3;
|
||||
if(checkPassword.reg.nums.test(val) || checkPassword.reg.letters.test(val)) return 4;
|
||||
if(checkPassword.reg.num.test(val) && checkPassword.reg.letter.test(val) && !checkPassword.reg.special.test(val)) return 5;
|
||||
if(checkPassword.reg.special.test(val)) return 6;
|
||||
};
|
||||
|
||||
|
||||
checkPassword.prototype = {
|
||||
init : function(){
|
||||
var level = checkPassword.level(this.obj.val());
|
||||
this.showTip(level);
|
||||
this.cfg.if_show && this.setState(level);
|
||||
this.isCorrect = level >= this.cfg.lowest_level; //密码输入正确与否
|
||||
},
|
||||
|
||||
/**
|
||||
*检测结果显示
|
||||
*@param {String, Number} 密码强度
|
||||
*/
|
||||
showTip : function(level){
|
||||
if(this.cfg.tips.length == 1){
|
||||
var error = this.cfg.error_cls[0], correct = this.cfg.correct_cls[0], tip = $(this.cfg.tips[0]);
|
||||
|
||||
if(level >= this.cfg.lowest_level){
|
||||
tip.removeClass(error).addClass(correct);
|
||||
tip.html(checkPassword.txt[level]);
|
||||
}else{
|
||||
tip.removeClass(correct).addClass(error);
|
||||
tip.html(checkPassword.txt[level]);
|
||||
}
|
||||
}else if(this.cfg.tips.length == 2){
|
||||
var error1 = this.cfg.error_cls[0], correct1 = this.cfg.correct_cls[0], tip1 = $(this.cfg.tips[0]), //tip1显示提示用语
|
||||
error2 = error1, correct2 = correct1, tip2 = $(this.cfg.tips[1]); //tip2显示图标
|
||||
|
||||
this.cfg.error_cls.length == 2 && (error2 = this.cfg.error_cls[1]);
|
||||
this.cfg.correct_cls.length == 2 && (correct2 = this.cfg.correct_cls[1]);
|
||||
|
||||
if(level >= this.cfg.lowest_level){
|
||||
tip1.removeClass(error1).addClass(correct1);
|
||||
tip1.html(checkPassword.txt[level]);
|
||||
tip2.removeClass(error2).addClass(correct2);
|
||||
}else{
|
||||
tip1.removeClass(correct1).addClass(error1);
|
||||
tip1.html(checkPassword.txt[level]);
|
||||
tip2.removeClass(correct2).addClass(error2);
|
||||
}
|
||||
}
|
||||
},//end of showTip
|
||||
|
||||
/**
|
||||
*显示密码强度
|
||||
*@param {String, Number} 密码强度
|
||||
*/
|
||||
setState : function(level){
|
||||
var pwdStrTip = $(this.cfg.strength), pwdInfo = pwdStrTip.find('.pwdInfo');
|
||||
if(level >= this.cfg.lowest_level){
|
||||
pwdStrTip.show();
|
||||
switch(level){
|
||||
case 4:
|
||||
this.setStyle("#FF0000","#FFFFFF","#FFFFFF");
|
||||
pwdInfo.text(":弱");
|
||||
break;
|
||||
case 5:
|
||||
this.setStyle("#FFD35E","#FFD35E","#FFFFFF");
|
||||
pwdInfo.text(":一般");
|
||||
break;
|
||||
case 6:
|
||||
this.setStyle("#95EB81","#95EB81","#95EB81");
|
||||
pwdInfo.text(":强");
|
||||
break;
|
||||
default:
|
||||
this.setStyle("#FFFFFF","#FFFFFF","#FFFFFF");
|
||||
pwdInfo.text("");
|
||||
}
|
||||
}else{
|
||||
pwdStrTip.hide();
|
||||
this.setStyle("#FFFFFF","#FFFFFF","#FFFFFF");
|
||||
pwdInfo.text("");
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
*设置密码强度条的颜色
|
||||
*@param {RGB}
|
||||
*@param {RGB}
|
||||
*@param {RGB}
|
||||
*/
|
||||
setStyle : function(st1,st2,st3){
|
||||
var s1 = $(this.cfg.strength).find('.s1'),
|
||||
s2 = $(this.cfg.strength).find('.s2'),
|
||||
s3 = $(this.cfg.strength).find('.s3');
|
||||
s1.css('background-color',st1);
|
||||
s2.css('background-color',st2);
|
||||
s3.css('background-color',st3);
|
||||
}
|
||||
}
|
||||
16
statics/resources/v7/js/jquery.min.js
vendored
Executable file
16
statics/resources/v7/js/jquery.min.js
vendored
Executable file
File diff suppressed because one or more lines are too long
164
statics/resources/v7/js/phone_validate.js
Executable file
164
statics/resources/v7/js/phone_validate.js
Executable file
@@ -0,0 +1,164 @@
|
||||
var intervalTime;
|
||||
|
||||
function checkRealName(){
|
||||
var realName = $('#real-name'),
|
||||
val = $.trim(realName.val());
|
||||
if(val.length == 0 || val == realName[0].defaultValue){
|
||||
showTip(realName,'真实姓名不能为空',0);
|
||||
return false;
|
||||
}
|
||||
showTip(realName,'');
|
||||
return true;
|
||||
}
|
||||
|
||||
function checkPhone(){
|
||||
var phone = $('#phone'),
|
||||
val = $.trim(phone.val()),
|
||||
reg = /^(13|15|17|18)(\d){9}$/;
|
||||
if(val.length == 0){
|
||||
showTip(phone,'手机号码不能为空',0);
|
||||
return false;
|
||||
}
|
||||
if(!reg.test(val)){
|
||||
showTip(phone,'请填写正确的手机号码',0);
|
||||
return false;
|
||||
}
|
||||
showTip(phone,'');
|
||||
return true;
|
||||
}
|
||||
|
||||
function checkActiveCode(){
|
||||
var activeCode = $('#active-code'),
|
||||
val = $.trim(activeCode.val()),
|
||||
flag = true;
|
||||
if(val.length == 0){
|
||||
showTip(activeCode,'验证码不能为空',0);
|
||||
return false;
|
||||
}
|
||||
if(val.length < 6){
|
||||
showTip(activeCode,'请填写正确的验证码',0);
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url: 'http://service.youshang.com/commonservice/ajaxChecking.do',
|
||||
type: 'GET',
|
||||
dataType:"text",
|
||||
async:false,
|
||||
data: 'action=checkActiveCode&mobile=' + $("#phone").val() + '&activeCode=' + val + '&userId=' + USERID,
|
||||
success: function(data){
|
||||
if(data.substring(0,2) == "OK"){
|
||||
showTip(activeCode,'');
|
||||
flag = true;
|
||||
}else{
|
||||
showTip(activeCode,'验证码有误或者已经过期',0);
|
||||
flag = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
return flag;
|
||||
}
|
||||
|
||||
function getUrlParams() {
|
||||
var param, url = location.search, theRequest = {};
|
||||
if (url.indexOf("?") != -1) {
|
||||
var str = url.substr(1);
|
||||
strs = str.split("&");
|
||||
for(var i = 0, len = strs.length; i < len; i ++) {
|
||||
param = strs[i].split("=");
|
||||
param[0] && (theRequest[param[0]]=decodeURIComponent(decodeURIComponent(param[1])));
|
||||
}
|
||||
}
|
||||
return theRequest;
|
||||
}
|
||||
|
||||
function getActiveCode(obj){
|
||||
if(typeof obj == 'string') obj = $(obj);
|
||||
obj.data('sending',true);
|
||||
showTip('#active-code','');
|
||||
$.post("http://service.youshang.com/commonservice/ajaxChecking.do",
|
||||
{action:"sendSmsActiveCode",
|
||||
mobile:$("#phone").val(),
|
||||
userId: USERID
|
||||
},
|
||||
function(data){
|
||||
obj.data('sending',false);
|
||||
if(data.status == "success"){
|
||||
showTip('#active-code','验证码已经发送');
|
||||
var _obj = $('.timeoutToShowCode');
|
||||
_obj.data('code',data.code);
|
||||
}else if(data.status == "limited"){
|
||||
showTip('#active-code','10分钟内只能发送3次',0);
|
||||
}else if(data.status == "failure"){
|
||||
showTip('#active-code','发送异常',0);
|
||||
}else if(data.status == "phoneExist"){
|
||||
showTip('#active-code','手机号码已被占用',0);
|
||||
}else{
|
||||
showTip('#active-code',data,0);
|
||||
}
|
||||
},
|
||||
"json"
|
||||
);
|
||||
}
|
||||
|
||||
function countDown(time){
|
||||
clearInterval(intervalTime);
|
||||
time = time || 60;
|
||||
var btn = $('#get-code');
|
||||
btn.addClass('ui-btn-dis').html(time + '秒后可以重发');
|
||||
intervalTime = setInterval(function(){
|
||||
time--;
|
||||
if(time > 0){
|
||||
btn.html(time + '秒后可以重发');
|
||||
}else{
|
||||
clearInterval(intervalTime);
|
||||
btn.removeClass('ui-btn-dis').html('免费获取验证码');
|
||||
var _obj = $('.timeoutToShowCode');
|
||||
var _code = _obj.data('code');
|
||||
_obj && _code && showTip(_obj,'当前验证码为:'+_code,0);
|
||||
|
||||
}
|
||||
},1000);
|
||||
}
|
||||
|
||||
function showTip(obj,ctn,type){
|
||||
obj = $(obj);
|
||||
var tip = obj.siblings('.tip').eq(0);
|
||||
if(tip.length == 0){
|
||||
tip = $('<p></p>').appendTo(obj.parents('li'));
|
||||
tip.addClass('tip');
|
||||
}
|
||||
if(type == 0){
|
||||
tip.html(ctn).addClass("tip-error").removeClass('tip-correct').show();
|
||||
}else{
|
||||
tip.removeClass("tip-error").addClass('tip-correct');
|
||||
ctn == '' ? tip.hide() : tip.html(ctn).show();
|
||||
}
|
||||
}
|
||||
|
||||
function checkPwd(){
|
||||
var password = $('#password'),
|
||||
val = password.val(),
|
||||
level = checkPassword.level(val);
|
||||
if(level < 5){
|
||||
showTip(password,checkPassword.txt[level],0);
|
||||
return false;
|
||||
}
|
||||
showTip(password,'');
|
||||
return true;
|
||||
}
|
||||
|
||||
function checkConfirmPwd(){
|
||||
var confirmPwd = $('#confirm-password'),
|
||||
val = confirmPwd.val(),
|
||||
passwordVal = $('#password').val();
|
||||
if(val.length == 0){
|
||||
showTip(confirmPwd,'确认密码不能为空',0);
|
||||
return false;
|
||||
}
|
||||
if(val != passwordVal){
|
||||
showTip(confirmPwd,'两次输入的密码不一致',0);
|
||||
return false;
|
||||
}
|
||||
showTip(confirmPwd,'');
|
||||
return true;
|
||||
}
|
||||
Reference in New Issue
Block a user