1.jquery-checkform.js
/**
* jQuery checkForm
* @Author Travis(LinYongji)
* @Contact http://travisup.com/
* @Version 1.0.1
*/
var savResultvalid = 0; /*表单校验是否成功标识，0表示成功,1表示失败--add by tanxingfu 2016-01-12*/
(function($) {
var reg = {
'date': /^\d{4}-\d{2}-\d{2}$/,
'datetime': /^\d{4}-\d{2}-\d{2}\s\d{2}:\d{2}$/,
'idcard': /(?:^\d{15}$)|(?:^\d{17}[\dxX]$)/,
'phone': /^1[358]\d{9}$/,
'email': /^[a-zA-Z0-9]+([_\.\-]\w+)*@\w+([_\.]\w+)*\.\w+([_\.]\w+)*$/,
'qq': /^[1-9]\d{4,9}$/,
'chinese': /^[\u4e00-\u9fa5]+$/,
'chinese_30': /^[\u4e00-\u9fa5]{2,6}$/,
'zf_255': /^\S{0,255}$/,
'eng' : /^[A-Za-z]+$/,
'chn' :/^[\u0391-\uFFE5]+$/,
'mail' : /\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/,
'url' : /^http[s]?:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/,
'currency' : /^\d+(\.\d+)?$/,
'number' : /^\d+$/,
'ch_int' : /^[0-9]{1,11}$/,
'double' : /^[-\+]?\d+(\.\d+)?$/,
'username' : /^[a-zA-Z]{1}([a-zA-Z0-9]|[._]){4,19}$/,
'password' : /^(\w){6,20}$/,
'cn_1':/^(\w){6,20}$/,
'safe' : />|<|,|\[|\]|\{|\}|\?|\/|\+|=|\||\'|\\|\"|:|;|\~|\!|\@|\#|\*|\$|\%|\^|\&|\(|\)|`/i,
'dbc' : /[ａ-ｚＡ-Ｚ０-９！＠＃￥％＾＆＊（）＿＋｛｝［］｜：＂＇；．，／？＜＞｀～ ]/,
'date' : /^((((1[6-9]|[2-9]\d)\d{2})-(0?[13578]|1[02])-(0?[1-9]|[12]\d|3[01]))|(((1[6-9]|[2-9]\d)\d{2})-(0?[13456789]|1[012])-(0?[1-9]|[12]\d|30))|(((1[6-9]|[2-9]\d)\d{2})-0?2-(0?[1-9]|1\d|2[0-8]))|(((1[6-9]|[2-9]\d)(0[48]|[2468][048]|[13579][26])|((16|[2468][048]|[3579][26])00))-0?2-29-))$/,
'year' : /^(19|20)[0-9]{2}$/,
'month' : /^(0?[1-9]|1[0-2])$/,
'day' : /^((0?[1-9])|((1|2)[0-9])|30|31)$/,
'hour' : /^((0?[1-9])|((1|2)[0-3]))$/,
'minute' : /^((0?[1-9])|((1|5)[0-9]))$/,
'second' : /^((0?[1-9])|((1|5)[0-9]))$/,
'mobile' : /^((\(\d{2,3}\))|(\d{3}\-))?13\d{9}$/,
'phone' : /^[+]{0,1}(\d){1,3}[ ]?([-]?((\d)|[ ]){1,12})+$/,
'zipcode' : /^((1[1-5])|(2[1-3])|(3[1-7])|(4[1-6])|(5[0-4])|(6[1-5])|71|(8[12])|91)\d{4}((19\d{2}(0[13-9]|1[012])(0[1-9]|[12]\d|30))|(19\d{2}(0[13578]|1[02])31)|(19\d{2}02(0[1-9]|1\d|2[0-8]))|(19([13579][26]|[2468][048]|0[48])0229))\d{3}(\d|X|x)?$/,
'ip' : /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/,
'file': /^[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/,
'image' : /.+\.(jpg|gif|png|bmp)$/i,
'word' : /.+\.(doc|rtf|pdf)$/i,
'max_val_24': /^((2[0-4]{1})|(1[0-9]{1})|([0-9]{1}))$/,
'max_val_23': /^((2[0-3]{1})|(1[0-9]{1})|([0-9]{1}))$/,
'max_val_48': /^(([4]{1}[0-8]{1})|([1-3]{0,1}[0-9]{1})|[1-9]{1})$/,
'max_val_47': /^(([4]{1}[0-7]{1})|([1-3]{0,1}[0-9]{1})|[1-9]{1})$/,
'max_val_100w':/^(1000000|([1-9]{1}[0-9]{0,5})|([1-9]{1}))$/,
'max_val_99w':/^(([1-9]{1}[0-9]{0,5})|([1-9]{1}))$/,
'max_val_max':/^(100000000|([1-9]{1}[0-9]{0,7})|([1-9]{1}))$/,
'max_val_max_j1':/^(([1-9]{1}[0-9]{0,7})|([1-9]{1}))$/
},
def = {
e: '',
w: '',
r: '',
t: 'next',
type: 'text',
cpass: 'check-pass',
cerror: 'check-error',
formid: 'myformsId', /*表单id--add by tanxingfu 2016-01-12*/
optbtnId: 'optBtn', /*操作按钮id--add by tanxingfu 2016-01-12*/
validresback: '0'
};
function tips($elem, t) {
var $tips;
if(t == 'next') {
$tips = $elem.eq(-1).next();
} else if(t == 'prev') {
$tips = $elem.eq(0).prev();
} else {
$tips = $(t);
}
return $tips.removeClass(def.cpass).removeClass(def.cerror);
}
var errorimgtext = "<img src='images/onError.gif' style='vertical-align:middle;' />";
var successimgtext = "<img src='images/onSuccess.gif' style='vertical-align:middle;' />";
function text() {
debugger
var $elem = $(this).eq(0),
o = $elem.data('checkform'),
val = $elem.val(),
$tips = tips($elem, o.t);
if(o.e && !val) {
$tips.html(errorimgtext).append(o.e).addClass(def.cerror);
//$tips.addClass(def.cerror).text(o.e);
return false;
}
if(val && o.w && o.r && !o.r.test(val)) {
$tips.html(errorimgtext).append(o.w).addClass(def.cerror);
//$tips.addClass(def.cerror).text(o.w);
return false;
}
//$tips.addClass(def.cpass).text('');
$tips.html(successimgtext).addClass(def.cpass);
return true;
}
function checked() {
var $elem = this.filter(':checked'),
o = this.eq(0).data('checkform'),
val,
i = 0,
$tips = tips($elem, o.t);
if(o.e && $elem.length === 0) {
$tips.html(errorimgtext).append(o.e).addClass(def.cerror);
//$tips.addClass(def.cerror).text(o.e);
return false;
}
if(o.w && o.r) {
for(; i < $elem.length; i++) {
val = $elem.eq(i).val();
if(val && !o.r.test(val)) {
$tips.html(errorimgtext).append(o.w).addClass(def.cerror);
//$tips.addClass(def.cerror).text(o.w);
return false;
}
}
}
//$tips.addClass(def.cpass).text('');
$tips.html(successimgtext).addClass(def.cpass);
return true;
}
function submit(e) {
var i,
$elem,
o = e.data,
sign = 0,
isvalid = 0;;
for(i in o) {
$elem = $(i);
if(o[i].type == 'text' || o[i].type == 'select') {
$elem[0] && !text.call($elem[0]) && sign++;
} else if(o[i].type == 'radio' || o[i].type == 'checkbox') {
$elem[0] && !checked.call($elem) && sign++;
}
if(!text.call($elem[0])){ /*判断校验结果--add by tanxingfu 2016-01-12*/
isvalid = 1;
}/*判断校验结果--add by tanxingfu 2016-01-12*/
//console.info($elem[0]+"----"+(!text.call($elem[0]))+"------"+sign);
}
/*判断校验结果--add by tanxingfu 2016-01-12*/
if(isvalid == 0){ //0表示校验成功
savResultvalid = 0;
return true;
}else{
savResultvalid = 1;
return false;
}
/*判断校验结果--add by tanxingfu 2016-01-12*/
}
function setup(options) {
var i;
for(i in def) {
if(options[i]) {
def[i] = options[i];
}
}
return def;
}
function init(options) {
var i, o, $elem;
if(typeof options === 'undefined') {
return;
}
for(i in options) {
$elem = $(i);
o = options[i];
o.r = reg[o.r] || o.r || def.r;
o.w = o.w || def.w;
o.e = o.e || def.e;
o.t = o.t || def.t;
o.type = o.type || def.type;
$elem.eq(0).data('checkform', o)
if(o.type == 'text') {
$elem.eq(0).bind('blur', text);
}
}
/*判断校验结果--update by tanxingfu 2016-01-12*/
//this.eq(0).bind('submit', options, submit);
$("#"+def.optbtnId).bind('click', options, submit); //add bind event to button
/*判断校验结果--update by tanxingfu 2016-01-12*/
}
$.fn.checkForm = init;
$.checkFormSetup = setup;
})(jQuery);
2.demo5.html
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery checkForm</title>
<style type="text/css">
.check-error{
font-size:12px;
}
</style>
</head>
<body>
<form action="demo2.html" method="post" id="myform">
<h1>Register</h1>
<p><label for="username">最大值: </label><input type="text" name="username" id="unames111"> <span style="color:red;"></span></p>
<p><label for="email">Email: </label><input type="text" name="email" id="youxiaong"> <span style="color:red;"></span></p>
<p><label for="password">月份: </label><input type="text" name="password" id="yuefengss"> <span style="color:red;"></span></p>
<p>
<input type="button" value="保存" id="submitbtn" />
<input type="button" value="返回" id="cancelbtn" />
</p>
</form>
<script type="text/javascript" src="js/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="js/jquery.checkform.js"></script>
<script type="text/javascript">
$.checkFormSetup({e: '',formid:'myform',optbtnId:'submitbtn'});
$("#myform").checkForm({
'#unames111': {e:'请输入用户名', w: '最大值为100000000.', r: 'max_val_max'},
'#yuefengss':{e:'请输入月份', w:'最大值为12', r:'month'},
'#youxiaong': {e: '请输入邮箱.', w: '请输入正确的邮箱.', r: 'email', t: 'next'}
});
$("#cancelbtn").click(function(){
document.location.href="demo3.html";
});
$("#submitbtn").click(function(){
alert(savResultvalid);
if(savResultvalid == 0){
document.location.href="demo2.html";
}
});
</script>
</body>
</html>
|
