js番茄的表单验证类_表单特效

来源：懂视网责编：小采时间：2020-11-27 20:39:33

js番茄的表单验证类_表单特效

js番茄的表单验证类_表单特效:相信大家看代码后再添加一些针对其他格式的验证也不是太麻烦的事情对于各种提示效果需要修改 feedback 方法就可以实现，因为不想让代码变得太臃肿，所以有很多不常用的功能就没有再添加了主要目的提供大家参考与分享，也希望能够根据大家的意见使其变得更加

推荐度：

点击下载本文 文档为doc格式

导读js番茄的表单验证类_表单特效:相信大家看代码后再添加一些针对其他格式的验证也不是太麻烦的事情对于各种提示效果需要修改 feedback 方法就可以实现，因为不想让代码变得太臃肿，所以有很多不常用的功能就没有再添加了主要目的提供大家参考与分享，也希望能够根据大家的意见使其变得更加

相信大家看代码后再添加一些针对其他格式的验证也不是太麻烦的事情
对于各种提示效果需要修改 feedback 方法就可以实现，因为不想让代码变得太臃肿，所以有很多不常用的功能就没有再添加了
主要目的提供大家参考与分享，也希望能够根据大家的意见使其变得更加完善

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>番茄的表单验证类_脚本之家</title> 
</pre>输出信息 
 this.tip = new Object(); 
 this.tip.unknow = '未找到的验证类型，无法执行验证。'; 
 this.tip.paramError = '参数设置错误，无法执行验证。'; 
 this.tip.required = '不允许为空。'; 
 this.tip.english = '仅允许英文字符及下划线 (a-zA-Z0-9_)。'; 
 this.tip.chinese = '仅允许中文字符。'; 
 this.tip.number = '不是一个有效的数字。'; 
 this.tip.integer = '不是一个有效的整数。'; 
 this.tip.float = '不是一个有效的浮点数。'; 
 this.tip.date = '不是一个有效的日期格式。 (例如：2007-06-29)'; 
 this.tip.email = '不是一个有效的电子邮件格式。'; 
 this.tip.url = '不是一个有效的超链接格式。'; 
 this.tip.phone = '不是一个有效的电话号码。'; 
 this.tip.mobile = '不是一个有效的手机号码。'; 
 this.tip.ip = '不是一个有效的IP地址。'; 
 this.tip.zipcode = '不是一个有效的邮政编码。'; 
 this.tip.qq = '不是一个有效的QQ号码。'; 
 this.tip.msn = '不是一个有效的MSN帐户。'; 
 this.tip.idcard = '不是一个有效的身份证号码。'; 
 //获取控件名称 
 this.getControlName = function () 
 { 
 return this.element.getAttribute('controlName') == null 
 ? '指定控件的值' 
 : this.element.getAttribute('controlName'); 
 } 
 //设定焦点 
 this.setFocus = function (ele) { 
 try { 
 ele.focus(); 
 } catch (e){} 
 } 
 //设置边框颜色 
 this.setBorderColor = function (ele) { 
 var borderColor = ele.currentStyle ? 
 ele.currentStyle.borderColor : 
 document.defaultView.getComputedStyle(ele, null)['borderColor']; 
 ele.style.borderColor = '#ff9900'; 
 ele.onkeyup = function () { 
 this.style.borderColor = borderColor; 
 } 
 } 
 //</script></pre>输出错误反馈信息 
 this.feedback = function (type) { 
 try { 
 var msg = eval('this.tip.' + type) == undefined ? 
 type : 
 this.getControlName() + eval('this.tip.' + type); 
 } catch (e) { 
 msg = type; 
 } 
 this.setBorderColor(this.element); 
 alert(msg); 
 this.setFocus(this.element); 
 }; 
 //执行字符串验证 
 this.validate = function () { 
 var v = this.element.value; 
 //验证是否允许非空 
 var required = this.element.getAttribute('required'); 
 if (required != null && v.isEmpty()) { 
 this.feedback('required'); 
 return false; 
 } 
 //验证是否合法格式 
 var dataType = this.element.getAttribute('dataType'); 
 if (!v.isEmpty() && dataType != null && dataType.toLowerCase() != 'password') { 
 dataType = dataType.toLowerCase(); 
 try { 
 if (!(eval('this.reg.' + dataType)).test(v)) { 
 this.feedback(dataType); 
 return false; 
 } 
 } catch(e) { 
 this.feedback('unknow'); 
 return false; 
 } 
 } 
 //执行数据验证 
 var confirm = this.element.getAttribute('confirm'); 
 if (confirm != null) { 
 try { 
 var data = eval('formObj.' + confirm + '.value'); 
 if (v != data) { 
 alert('两次输入的内容不一致，请重新输入。'); 
 this.setBorderColor(this.element); 
 this.setFocus(this.element); 
 return false; 
 } 
 } catch (e) { 
 this.feedback('paramError'); 
 return false; 
 } 
 } 
 //验证数字大小 
 var dataBetween = this.element.getAttribute('dataBetween'); 
 if (!v.isEmpty() && dataBetween != null) { 
 var min = dataBetween.getBetweenVal('min'); 
 var max = dataBetween.getBetweenVal('max'); 
 if (min == null || max == null) { 
 this.feedback('paramError'); 
 return false; 
 } 
 if (!v.isBetween(v.trim(), min, max)) { 
 this.feedback(this.getControlName() + '必须是介于 ' + min + '-' + max + ' 之间的数字。'); 
 return false; 
 } 
 } 
 //验证字符长度 
 var dataLength = this.element.getAttribute('dataLength'); 
 if (!v.isEmpty() && dataLength != null) { 
 var min = dataLength.getBetweenVal('min'); 
 var max = dataLength.getBetweenVal('max'); 
 if (min == null || max == null) { 
 this.feedback('paramError'); 
 return false; 
 } 
 if (!v.isBetween(v.trim().length, min, max)) { 
 this.feedback(this.getControlName() + '必须是 ' + min + '-' + max + ' 个字符。'); 
 return false; 
 } 
 } 
 return true; 
 }; 
 //执行初始化操作 
 this.init = function () { 
 for (var i=0; i<this.allTags.length; i++) { 
 if (this.allTags[i].tagName.toUpperCase() == 'INPUT' || 
 this.allTags[i].tagName.toUpperCase() == 'SELECT' || 
 this.allTags[i].tagName.toUpperCase() == 'TEXTAREA') 
 { 
 this.element = allTags[i]; 
 if (!this.validate()) 
 return false; 
 } 
 } 
 }; 
 return this.init(); 
} 
</ script> 
</head> 
<body> 
 
</body> 
</html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]
1.".3"这样也是算浮点数的
2.this.reg和this.tip可以用
this.reg = {englisth : /^[a-zA-Z0-9_\-]+$/, chinese : /^[\u0391-\uFFE5]+$/}
这种形式，省点代码
3.日期只验证格式没有验证合法性

btw:controlName的做法不错

声明：本网页内容旨在传播知识，若有侵权等问题请及时与本网联系，我们将在第一时间删除处理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

js番茄的表单验证类_表单特效

推荐度：

点击下载本文 文档为doc格式

标签：验证特效特殊效果

热门焦点

js番茄的表单验证类_表单特效

js番茄的表单验证类_表单特效

js番茄的表单验证类_表单特效

最新推荐

猜你喜欢

热门推荐