前台数据验证(2)
“前台数据验证(1)”存在如下问题:
1、javascript 验证控件目前是一个页面上的数据全部验证,如果一个页面上存在两个提交服务器的操作该验证控件将失效,
2、浮点数的位数目前是全部都控制5位,也就是全部页面是上的浮点数的小数位数最多为5位。
提出解决的方案
1、将提交服务器的数据分组用一个容器装起来,验证的时候,圈定一个范围进行验证,这样就可以解决一个页面,多个提交服务器的操作
2、给标签加一个属性datatype=flate,2 默认为2位小数进行处理
代码
/* ----------------------------------------------------------------------
* Description:前台数据过滤 辅助类
*
* Create Author:用二进制做高等数学
*
* Create DateTime:2010.1.1
*
* Copyright:
*----------------------------------------------------------------------*/
function valid(obj) {
$("#"+obj).find("input[required=true]:visible,textarea[required=true]:visible").trigger('blur');
var numError = $("form .onError").length;
if (numError) {
return false;
}
return true;
}
function msg(obj, msge) {
var $parent = $(obj).parent();
if ($(obj).attr("msg")) {
$parent.append('<span class="formtips onError">' + $(obj).attr("msg") + '</span>');
}
else {
$parent.append('<span class="formtips onError">' + msge + '</span>');
}
}
$(document).ready(function() {
//必填项后面加上 星号
$("input[required=true]:visible,textarea[required=true]:visible").each(function() {
var $required = $("<strong class='high'>*</strong>");
$(this).parent().append($required);
});
$('input,textarea').blur(function() {
var $parent = $(this).parent();
$parent.find(".formtips").remove();
var val = $.trim(this.value);
var msge = "";
//验证必填项
msge = message['required'];
if ($(this).attr("required")) {
if (null == val || "" == val) {
msg(this, msge);
return;
}
}
//最小长度
msge = message['minlength'] + $(this).attr("minlength") + message['char'];
if ($(this).attr("minlength")) {
if (getLength(val) < $(this).attr("minlength")) {
msg(this, msge);
return;
}
}
//最大长度
msge = message['maxlength'] + $(this).attr("maxlength") + message['char'];
if ($(this).attr("maxlength")) {
if (getLength(val) > $(this).attr("maxlength")) {
msg(this, msge);
return;
}
}
//格式验证
var ischeck = "true";
if ($(this).attr("datatype")) {
if (null == val || "" == val) {
return;
}
var formart = $(this).attr("datatype");
msge = message[formart];
var dcount=2;
if(formart.split(',').length >1){
dcount=formart.split(',')[1];
msge = "小数且最多保留"+dcount+"位";
formart=formart.split(',')[0];
}
switch (formart) {
case "email":
ischeck = "isEmail('" + val + "')";
break;
case "digital":
ischeck = "isDigital('" + val + "')";
break;
case "date":
ischeck = "isDate('" + val + "')";
break;
case "zipcode":
ischeck = "isZipCode('" + val + "')";
break;
case "pinteger":
ischeck = "isInt('" + val + "')";
break;
case "url":
ischeck = "isUrl('" + val + "')";
break;
case "float":
ischeck = "isFloat('" + val + "','" + dcount + "')";
break;
case "photo":
ischeck = "isPhoto('" + val + "')";
break;
case "special":
ischeck = "isSpecial('" + val + "')";
break;
case "chinese":
ischeck = "isChinese('" + val + "')";
break;
}
if (!eval(ischeck)) {
msg(this, msge);
return;
}
}
//最大值
msge = message["maxvalue"] + $(this).attr("maxvalue");
if ($(this).attr("maxvalue") && "" != val) {
if (parseFloat(val) > parseFloat($(this).attr("maxvalue"))) {
msg(this, msge);
return;
}
}
//最小值
msge = message["minvalue"] + $(this).attr("minvalue");
if ($(this).attr("minvalue") && "" != val) {
if (parseFloat(val) < parseFloat($(this).attr("minvalue"))) {
msg(this, msge);
return;
}
}
}).keyup(function() {
$(this).triggerHandler("blur");
}).focus(function() {
$(this).triggerHandler("blur");
}); //end blur
//get the length
function getLength(strValue) {
var cArr = strValue.match(/[^\x00-\xff]/ig);
return strValue.length + (cArr == null ? 0 : cArr.length);
}
//validate the email
function isEmail(strEmail) {
if (strEmail.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1)
return true;
else
return false;
}
//validate the intigral
function isInt(strInt) {
if ("0" == strInt) {
return false;
}
var firstchar = strInt.substring(0, 1);
if ("0" == firstchar && "0" != strInt) {
return false;
}
for (var i = 0; i < strInt.length; i++) {
var ch = strInt.substring(i, i + 1);
if (!("0" <= ch && "9" >= ch)) {
return false;
}
}
return true;
}
//validate the date
function isDate(strDate) {
var datestr = strDate.split('/').join('-');
datestr = datestr.split(':').join('-');
datestr = datestr.split('.').join('-');
if (datestr.split('-')[0].length == 2) {
var current = new Date();
var current_year = current.getFullYear();
datestr = current_year.toString().substring(0, 2) + datestr;
}
var dateFormart = /^(\d{4})(-)(\d{1,2})(-)(\d{1,2})$/;
var matchArr = datestr.match(dateFormart);
if (null == matchArr) {
return false;
}
month = matchArr[3];
day = matchArr[5];
year = matchArr[1];
if (month < 1 || month > 12) {
return false;
}
if (day < 1 || day > 31) {
return false;
}
if ((month == 4 || month == 6 || month == 9 || month == 11) && day == 31) {
return false;
}
if (month == 2) {
var isleap = (year / 4 == 0 && (year / 100 != 0 || year / 400 == 0));
if (day > 29) {
return false;
}
if (day == 29 && !isleap) {
return false;
}
}
return true;
}
//validate the zip code
function isZipCode(strZipCode) {
var reg = /^[1-9]\d{5}$/;
return reg.test(strZipCode);
}
//validate the float number
function isFloat(strFloat,dcount) {
var tcount = dcount; //set the digit of dicimal the number
if (strFloat.substring(0, 1) == ".") {
return false;
}
var pointcount = 0;
for (var i = 0; i < strFloat.length; i++) {
var ch = strFloat.substring(i, i + 1);
if (!((ch >= "0" && ch <= "9") || ch == ".")) {
return false;
}
if (ch == ".") {
pointcount++;
}
if (pointcount > 1) {
return false;
}
}
if (strFloat.indexOf(".") != -1 && strFloat.length - (strFloat.indexOf(".") + 1) > tcount) {
return false;
}
var start1 = strFloat.substring(0, 1);
var start2 = strFloat.substring(1, 2);
if (start1 == 0 && start2 != ".") {
for (var i = 0; i < strFloat.length; i++) {
var ch = strFloat.substring(i, i + 1);
if (ch == 0)
pointcount++;
}
if (pointcount == strFloat.length) {
return true;
}
return false;
}
return true;
}
//validate the photo
function isPhoto(strPhoto) {
var strFormat = "jpg | jpeg | gif | png | bmp | pic ";
if (strPhoto.indexOf(".") > -1) {
var point = strPhoto.lastIndexOf(".");
var file = strPhoto.substring(point + 1, strPhoto.length);
if (!(strFormat.indexOf(file.toLowerCase()) > -1)) {
return false;
}
}
return true;
}
//validate the special character
function isSpecial(strspecial) {
for (var i = 0; i < strspecial.length; i++) {
var ch = strspecial.charAt(i);
if ((ch == "`") || (ch == "~") || (ch == "!") || (ch == "@") ||
(ch == "#") || (ch == "\"") || (ch == "^") || (ch == "&") ||
(ch == "*") || (ch == "(") || (ch == ")") || (ch == "+") ||
(ch == "=") || (ch == "|") || (ch == "{") || (ch == "}") ||
(ch == "[") || (ch == "]") || (ch == ":") || (ch == ";") ||
(ch == "'") || (ch == '"') || (ch == "<") || (ch == ">") ||
(ch == ",") || (ch == ".") || (ch == "\\") || (ch == "?") ||
(ch == "/")) {
return false;
}
}
return true;
}
//validate the number
function isDigital(strValue) {
var reg = /^\d+(?=\.{0,1}\d+$|$)/
return reg.test(strValue)
}
//validate the Url
function isUrl(strValue) {
var reg = /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/;
return strValue.match(reg);
}
//validate the Chinese
function isChinese(strValue) {
if (escape(strValue).indexOf("%u") != -1) {
return false;
}
return true;
}
var message = {
"required": "\u5FC5\u586B\u9879", //必填项
"minlength": "\u6700\u5C0F\u957F\u5EA6", //最小长度
"maxlength": "\u6700\u5927\u957F\u5EA6", //最大长度
"char": "\u5B57\u7B26", //字符
"email": "\u4E3AEmail\u683C\u5F0F", //为Email格式
"digital": "\u4E3A\u6570\u5B57\u683C\u5F0F", //为数字格式
"date": "\u4E3A\u65E5\u671F\u683C\u5F0F", //为日期格式
"zipcode": "\u4E3A\u90AE\u7F16\u683C\u5F0F", //为邮编格式
"pinteger": "\u4E3A\u6B63\u6574\u6570", //为正整数
"url": "\u4E3AUrl\u683C\u5F0F", //为 Url 格式
"float": "\u5C0F\u6570\u4E14\u4FDD\u7559\u4E94\u4F4D", //小数且保留两位
"photo": "\u4E3A\u56FE\u7247\u683C\u5F0F", //为图片格式
"special": "\u542B\u6709\u7279\u6B8A\u5B57\u7B26", //含有特殊字符
"chinese": "\u4E3A\u82F1\u6587\u6216\u82F1\u6587\u548C\u6570\u5B57\u7684\u7EC4\u5408", //为英文或英文和数字的组合
"maxvalue": "\u6700\u5927\u503C\u4E3A", //最大值为
"minvalue": "\u6700\u5C0F\u503C\u70BA"//最小值为
};
})
* Description:前台数据过滤 辅助类
*
* Create Author:用二进制做高等数学
*
* Create DateTime:2010.1.1
*
* Copyright:
*----------------------------------------------------------------------*/
function valid(obj) {
$("#"+obj).find("input[required=true]:visible,textarea[required=true]:visible").trigger('blur');
var numError = $("form .onError").length;
if (numError) {
return false;
}
return true;
}
function msg(obj, msge) {
var $parent = $(obj).parent();
if ($(obj).attr("msg")) {
$parent.append('<span class="formtips onError">' + $(obj).attr("msg") + '</span>');
}
else {
$parent.append('<span class="formtips onError">' + msge + '</span>');
}
}
$(document).ready(function() {
//必填项后面加上 星号
$("input[required=true]:visible,textarea[required=true]:visible").each(function() {
var $required = $("<strong class='high'>*</strong>");
$(this).parent().append($required);
});
$('input,textarea').blur(function() {
var $parent = $(this).parent();
$parent.find(".formtips").remove();
var val = $.trim(this.value);
var msge = "";
//验证必填项
msge = message['required'];
if ($(this).attr("required")) {
if (null == val || "" == val) {
msg(this, msge);
return;
}
}
//最小长度
msge = message['minlength'] + $(this).attr("minlength") + message['char'];
if ($(this).attr("minlength")) {
if (getLength(val) < $(this).attr("minlength")) {
msg(this, msge);
return;
}
}
//最大长度
msge = message['maxlength'] + $(this).attr("maxlength") + message['char'];
if ($(this).attr("maxlength")) {
if (getLength(val) > $(this).attr("maxlength")) {
msg(this, msge);
return;
}
}
//格式验证
var ischeck = "true";
if ($(this).attr("datatype")) {
if (null == val || "" == val) {
return;
}
var formart = $(this).attr("datatype");
msge = message[formart];
var dcount=2;
if(formart.split(',').length >1){
dcount=formart.split(',')[1];
msge = "小数且最多保留"+dcount+"位";
formart=formart.split(',')[0];
}
switch (formart) {
case "email":
ischeck = "isEmail('" + val + "')";
break;
case "digital":
ischeck = "isDigital('" + val + "')";
break;
case "date":
ischeck = "isDate('" + val + "')";
break;
case "zipcode":
ischeck = "isZipCode('" + val + "')";
break;
case "pinteger":
ischeck = "isInt('" + val + "')";
break;
case "url":
ischeck = "isUrl('" + val + "')";
break;
case "float":
ischeck = "isFloat('" + val + "','" + dcount + "')";
break;
case "photo":
ischeck = "isPhoto('" + val + "')";
break;
case "special":
ischeck = "isSpecial('" + val + "')";
break;
case "chinese":
ischeck = "isChinese('" + val + "')";
break;
}
if (!eval(ischeck)) {
msg(this, msge);
return;
}
}
//最大值
msge = message["maxvalue"] + $(this).attr("maxvalue");
if ($(this).attr("maxvalue") && "" != val) {
if (parseFloat(val) > parseFloat($(this).attr("maxvalue"))) {
msg(this, msge);
return;
}
}
//最小值
msge = message["minvalue"] + $(this).attr("minvalue");
if ($(this).attr("minvalue") && "" != val) {
if (parseFloat(val) < parseFloat($(this).attr("minvalue"))) {
msg(this, msge);
return;
}
}
}).keyup(function() {
$(this).triggerHandler("blur");
}).focus(function() {
$(this).triggerHandler("blur");
}); //end blur
//get the length
function getLength(strValue) {
var cArr = strValue.match(/[^\x00-\xff]/ig);
return strValue.length + (cArr == null ? 0 : cArr.length);
}
//validate the email
function isEmail(strEmail) {
if (strEmail.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1)
return true;
else
return false;
}
//validate the intigral
function isInt(strInt) {
if ("0" == strInt) {
return false;
}
var firstchar = strInt.substring(0, 1);
if ("0" == firstchar && "0" != strInt) {
return false;
}
for (var i = 0; i < strInt.length; i++) {
var ch = strInt.substring(i, i + 1);
if (!("0" <= ch && "9" >= ch)) {
return false;
}
}
return true;
}
//validate the date
function isDate(strDate) {
var datestr = strDate.split('/').join('-');
datestr = datestr.split(':').join('-');
datestr = datestr.split('.').join('-');
if (datestr.split('-')[0].length == 2) {
var current = new Date();
var current_year = current.getFullYear();
datestr = current_year.toString().substring(0, 2) + datestr;
}
var dateFormart = /^(\d{4})(-)(\d{1,2})(-)(\d{1,2})$/;
var matchArr = datestr.match(dateFormart);
if (null == matchArr) {
return false;
}
month = matchArr[3];
day = matchArr[5];
year = matchArr[1];
if (month < 1 || month > 12) {
return false;
}
if (day < 1 || day > 31) {
return false;
}
if ((month == 4 || month == 6 || month == 9 || month == 11) && day == 31) {
return false;
}
if (month == 2) {
var isleap = (year / 4 == 0 && (year / 100 != 0 || year / 400 == 0));
if (day > 29) {
return false;
}
if (day == 29 && !isleap) {
return false;
}
}
return true;
}
//validate the zip code
function isZipCode(strZipCode) {
var reg = /^[1-9]\d{5}$/;
return reg.test(strZipCode);
}
//validate the float number
function isFloat(strFloat,dcount) {
var tcount = dcount; //set the digit of dicimal the number
if (strFloat.substring(0, 1) == ".") {
return false;
}
var pointcount = 0;
for (var i = 0; i < strFloat.length; i++) {
var ch = strFloat.substring(i, i + 1);
if (!((ch >= "0" && ch <= "9") || ch == ".")) {
return false;
}
if (ch == ".") {
pointcount++;
}
if (pointcount > 1) {
return false;
}
}
if (strFloat.indexOf(".") != -1 && strFloat.length - (strFloat.indexOf(".") + 1) > tcount) {
return false;
}
var start1 = strFloat.substring(0, 1);
var start2 = strFloat.substring(1, 2);
if (start1 == 0 && start2 != ".") {
for (var i = 0; i < strFloat.length; i++) {
var ch = strFloat.substring(i, i + 1);
if (ch == 0)
pointcount++;
}
if (pointcount == strFloat.length) {
return true;
}
return false;
}
return true;
}
//validate the photo
function isPhoto(strPhoto) {
var strFormat = "jpg | jpeg | gif | png | bmp | pic ";
if (strPhoto.indexOf(".") > -1) {
var point = strPhoto.lastIndexOf(".");
var file = strPhoto.substring(point + 1, strPhoto.length);
if (!(strFormat.indexOf(file.toLowerCase()) > -1)) {
return false;
}
}
return true;
}
//validate the special character
function isSpecial(strspecial) {
for (var i = 0; i < strspecial.length; i++) {
var ch = strspecial.charAt(i);
if ((ch == "`") || (ch == "~") || (ch == "!") || (ch == "@") ||
(ch == "#") || (ch == "\"") || (ch == "^") || (ch == "&") ||
(ch == "*") || (ch == "(") || (ch == ")") || (ch == "+") ||
(ch == "=") || (ch == "|") || (ch == "{") || (ch == "}") ||
(ch == "[") || (ch == "]") || (ch == ":") || (ch == ";") ||
(ch == "'") || (ch == '"') || (ch == "<") || (ch == ">") ||
(ch == ",") || (ch == ".") || (ch == "\\") || (ch == "?") ||
(ch == "/")) {
return false;
}
}
return true;
}
//validate the number
function isDigital(strValue) {
var reg = /^\d+(?=\.{0,1}\d+$|$)/
return reg.test(strValue)
}
//validate the Url
function isUrl(strValue) {
var reg = /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/;
return strValue.match(reg);
}
//validate the Chinese
function isChinese(strValue) {
if (escape(strValue).indexOf("%u") != -1) {
return false;
}
return true;
}
var message = {
"required": "\u5FC5\u586B\u9879", //必填项
"minlength": "\u6700\u5C0F\u957F\u5EA6", //最小长度
"maxlength": "\u6700\u5927\u957F\u5EA6", //最大长度
"char": "\u5B57\u7B26", //字符
"email": "\u4E3AEmail\u683C\u5F0F", //为Email格式
"digital": "\u4E3A\u6570\u5B57\u683C\u5F0F", //为数字格式
"date": "\u4E3A\u65E5\u671F\u683C\u5F0F", //为日期格式
"zipcode": "\u4E3A\u90AE\u7F16\u683C\u5F0F", //为邮编格式
"pinteger": "\u4E3A\u6B63\u6574\u6570", //为正整数
"url": "\u4E3AUrl\u683C\u5F0F", //为 Url 格式
"float": "\u5C0F\u6570\u4E14\u4FDD\u7559\u4E94\u4F4D", //小数且保留两位
"photo": "\u4E3A\u56FE\u7247\u683C\u5F0F", //为图片格式
"special": "\u542B\u6709\u7279\u6B8A\u5B57\u7B26", //含有特殊字符
"chinese": "\u4E3A\u82F1\u6587\u6216\u82F1\u6587\u548C\u6570\u5B57\u7684\u7EC4\u5408", //为英文或英文和数字的组合
"maxvalue": "\u6700\u5927\u503C\u4E3A", //最大值为
"minvalue": "\u6700\u5C0F\u503C\u70BA"//最小值为
};
})