作者:虽虽___Hui | 来源:互联网 | 2023-05-17 14:07
我有一个Javascript表单验证器功能
switch (element.getAttribute('validationtype')) {
case 'text':
if (cic.visible(element)) {
if (cic.getValue(element).strip() == "") {
errors.push(element.getAttribute('validationmsg'));
element.style.border = "1px solid #B23232";
} else {
element.style.border = "1px solid #CAD5DE";
}
}
break;
case 'textarea': if (element.value.strip() == "") {
errors.push(element.getAttribute('validationmsg'));
}
break;
case 'email':
if (!cic.isEmail(cic.getValue(element))) {
errors.push(element.getAttribute('validationmsg'));
element.style.border = "1px solid #B23232";
} else {
element.style.border = "1px solid #CAD5DE";
};
break;
case 'numeric':
if (cic.getValue(element).strip() == "" || isNaN(cic.getValue(element).replace(',', '.'))) {
errors.push(element.getAttribute('validationmsg'));
element.style.border = "1px solid #B23232";
} else {
element.style.border = "1px solid #CAD5DE";
};
break;
}
每当我需要一个新的验证类型时,我必须更改该功能.
将此函数组织为一个类的最佳方法应该是什么,以便它可以关闭以进行更改.
解决方法:
您需要在验证中找到公共部分,并找到特定类型的部分(不要重复自己).
// Type Specific Validation
var Validator = {
"text": function (data) {
// validate text
},
"email": function (data) {
// validate email
},
// ...
}
你的功能内部:
// Common Validation
var type = el.getAttribute('validationtype');
var isValid = Validator[type];
if ( cic.visible(el) ) {
if ( !isValid(el) ) {
element.style.border = "1px solid #B23232";
errors.push(element.getAttribute('validationmsg'));
} else {
element.style.border = "1px solid #CAD5DE";
}
}