`
xiaolan02
  • 浏览: 59911 次
社区版块
存档分类
最新评论

javascript验证Validator.js

阅读更多

 

  1.   
  2. /*************************************************  
  3. Validator v1.03  
  4. code by 我佛山人  
  5. wfsr@msn.com  
  6. *************************************************/  
  7. Validator = {   
  8. Require : /.+/,   
  9. Email : /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/,   
  10. Phone : /^((\(\d{3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/,   
  11. Mobile : /^((\(\d{3}\))|(\d{3}\-))?13\d{9}$/,   
  12. Url : /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/,  
  13. IdCard : /^\d{15}(\d{2}[A-Za-z0-9])?$/,  
  14. Currency : /^\d+(\.\d+)?$/,  
  15. Number : /^\d+$/,  
  16. Zip : /^[1-9]\d{5}$/,  
  17. QQ : /^[1-9]\d{4,8}$/,  
  18. Integer : /^[-\+]?\d+$/,  
  19. Double : /^[-\+]?\d+(\.\d+)?$/,  
  20. English : /^[A-Za-z]+$/,  
  21. Chinese : /^[\u0391-\uFFE5]+$/,  
  22. Username : /^[a-z]\w{3,}$/i,  
  23. UnSafe : /^(([A-Z]*|[a-z]*|\d*|[-_\~!@#\$%\^&\*\.\(\)\[\]\{\}<>\?\\\/\'\"]*)|.{0,5})$|\s/,  
  24. IsSafe : function(str){return !this.UnSafe.test(str);},  
  25. SafeString : "this.IsSafe(value)",  
  26. Limit : "this.limit(value.length,getAttribute('min'), getAttribute('max'))",  
  27. LimitB : "this.limit(this.LenB(value), getAttribute('min'), getAttribute('max'))",  
  28. Date : "this.IsDate(value, getAttribute('min'), getAttribute('format'))",  
  29. Repeat : "value == document.getElementsByName(getAttribute('to'))[0].value",  
  30. Range : "getAttribute('min') < (value|0) && (value|0) < getAttribute('max')",  
  31. Compare : "this.compare(value,getAttribute('operator'),getAttribute('to'))",  
  32. Custom : "this.Exec(value, getAttribute('regexp'))",  
  33. Group : "this.MustChecked(getAttribute('name'), getAttribute('min'), getAttribute('max'))",  
  34. ErrorItem : [document.forms[0]],  
  35. ErrorMessage : ["以下原因导致提交失败:\t\t\t\t"],  
  36. Validate : function(theForm, mode){  
  37. var ōbj = theForm || event.srcElement;  
  38. var count = obj.elements.length;  
  39. this.ErrorMessage.length = 1;  
  40. this.ErrorItem.length = 1;  
  41. this.ErrorItem[0] = obj;  
  42. for(var i=0;i 
  43. with(obj.elements[i]){  
  44. var _dataType = getAttribute("dataType");  
  45. if(typeof(_dataType) == "object" || typeof(this[_dataType]) == "undefined") continue;  
  46. this.ClearState(obj.elements[i]);  
  47. if(getAttribute("require") == "false" && value == "") continue;  
  48. switch(_dataType){  
  49. case "Date" :  
  50. case "Repeat" :  
  51. case "Range" :  
  52. case "Compare" :  
  53. case "Custom" :  
  54. case "Group" :   
  55. case "Limit" :  
  56. case "LimitB" :  
  57. case "SafeString" :  
  58. if(!eval(this[_dataType])) {  
  59. this.AddError(i, getAttribute("msg"));  
  60. }  
  61. break;  
  62. default :  
  63. if(!this[_dataType].test(value)){  
  64. this.AddError(i, getAttribute("msg"));  
  65. }  
  66. break;  
  67. }  
  68. }  
  69. }  
  70. if(this.ErrorMessage.length > 1){  
  71. mode = mode || 1;  
  72. var errCount = this.ErrorItem.length;  
  73. switch(mode){  
  74. case 2 :  
  75. for(var i=1;i 
  76. this.ErrorItem[i].style.color = "red";  
  77. case 1 :  
  78. alert(this.ErrorMessage.join("\n"));  
  79. this.ErrorItem[1].focus();  
  80. break;  
  81. case 3 :  
  82. for(var i=1;i 
  83. try{  
  84. var span = document.createElement("SPAN");  
  85. span.id = "__ErrorMessagePanel";  
  86. span.style.color = "red";  
  87. this.ErrorItem[i].parentNode.appendChild(span);  
  88. span.innerHTML = this.ErrorMessage[i].replace(/\d+:/,"*");  
  89. }  
  90. catch(e){alert(e.descrīption);}  
  91. }  
  92. this.ErrorItem[1].focus();  
  93. break;  
  94. default :  
  95. alert(this.ErrorMessage.join("\n"));  
  96. break;  
  97. }  
  98. return false;  
  99. }  
  100. return true;  
  101. },  
  102. limit : function(len,min, max){  
  103. min = min || 0;  
  104. max = max || Number.MAX_VALUE;  
  105. return min <= len && len <= max;  
  106. },  
  107. LenB : function(str){  
  108. return str.replace(/[^\x00-\xff]/g,"**").length;  
  109. },  
  110. ClearState : function(elem){  
  111. with(elem){  
  112. if(style.color == "red")  
  113. style.color = "";  
  114. var lastNode = parentNode.childNodes[parentNode.childNodes.length-1];  
  115. if(lastNode.id == "__ErrorMessagePanel")  
  116. parentNode.removeChild(lastNode);  
  117. }  
  118. },  
  119. AddError : function(index, str){  
  120. this.ErrorItem[this.ErrorItem.length] = this.ErrorItem[0].elements[index];  
  121. this.ErrorMessage[this.ErrorMessage.length] = this.ErrorMessage.length + ":" + str;  
  122. },  
  123. Exec : function(op, reg){  
  124. return new RegExp(reg,"g").test(op);  
  125. },  
  126. compare : function(op1,operator,op2){  
  127. switch (operator) {  
  128. case "NotEqual":  
  129. return (op1 != op2);  
  130. case "GreaterThan":  
  131. return (op1 > op2);  
  132. case "GreaterThanEqual":  
  133. return (op1 >= op2);  
  134. case "LessThan":  
  135. return (op1 < op2);  
  136. case "LessThanEqual":  
  137. return (op1 <= op2);  
  138. default:  
  139. return (op1 == op2);   
  140. }  
  141. },  
  142. MustChecked : function(name, min, max){  
  143. var groups = document.getElementsByName(name);  
  144. var hasChecked = 0;  
  145. min = min || 1;  
  146. max = max || groups.length;  
  147. for(var i=groups.length-1;i>=0;i--)  
  148. if(groups[i].checked) hasChecked++;  
  149. return min <= hasChecked && hasChecked <= max;  
  150. },  
  151. IsDate : function(op, formatString){  
  152. formatString = formatString || "ymd";  
  153. var m, year, month, day;  
  154. switch(formatString){  
  155. case "ymd" :  
  156. m = op.match(new RegExp("^((\\d{4})|(\\d{2}))([-./])(\\d{1,2})\\4(\\d{1,2})$"));  
  157. if(m == null ) return false;  
  158. day = m[6];  
  159. month = m[5]*1;  
  160. year = (m[2].length == 4) ? m[2] : GetFullYear(parseInt(m[3], 10));  
  161. break;  
  162. case "dmy" :  
  163. m = op.match(new RegExp("^(\\d{1,2})([-./])(\\d{1,2})\\2((\\d{4})|(\\d{2}))$"));  
  164. if(m == null ) return false;  
  165. day = m[1];  
  166. month = m[3]*1;  
  167. year = (m[5].length == 4) ? m[5] : GetFullYear(parseInt(m[6], 10));  
  168. break;  
  169. default :  
  170. break;  
  171. }  
  172. if(!parseInt(month)) return false;  
  173. month = month==0 ?12:month;  
  174. var date = new Date(year, month-1, day);  
  175. return (typeof(date) == "object" && year == date.getFullYear() && month == (date.getMonth()+1) && day == date.getDate());  
  176. function GetFullYear(y){return ((y<30 ? "20" : "19") + y)|0;}   
  177. }   
  178. }   
  179.   
js 代码

使用:

语法dataType="Require | Chinese | English | Number | Integer | Double | Email | Url | Phone | Mobile | Currency | Zip | IdCard | QQ | Date | SafeString | Repeat | Compare | Range | Limit | LimitB | Group | Custom"
类型字符串。必选。
说明:用于设定表单项的输入数据验证类型。
选值说明
可选值 验证功能
Require 必填项
Chinese 中文
English 英文

Number
数字
Integer
整数
Double
实数
Email
Email地址格式
Url
基于HTTP协议的网址格式
Phone
电话号码格式
Mobile
手机号码格式
Currency
货币格式
Zip
邮政编码
IdCard
身份证号码
QQ
QQ号码
Date
日期
SafeString
安全密码
Repeat
重复输入
Compare
关系比较
Range
输入范围
Limit
限制输入长度
LimitB
限制输入的字节长度
Group 验证单/多选按钮组
Custom 自定义正则表达式验证

 

语法max="int"
类型:字符串。在dataType属性值为Range时必选,为Group且待验证项是多选按钮组时可选(此时默认值为1),为为Limit/LimitB时可选(此时默认值为1.7976931348623157e+308,即Number.MAX_VALUE的值)。
说明:当daType属性值为Range时,用于判断输入是否在minmax的属性值间;当dataType属性值为Group,且待验证项是多选按钮组时,用于设定多选按钮组的选中个数,判断选中个数是否在[min, max]区间;当daType属性值为Limit时,用于验证输入的字符数是否在[min, max]区间;当daType属性值为LimitB时,用于验证输入字符的字节数是否在[min, max]区间。

 

语法min="int"
类型:字符串。在dataType属性值为Range时必选,为Group且待验证项是多选按钮组时可选(此时默认值为1),为为Limit/LimitB时可选(此时默认值为0)。
说明:当daType属性值为Range时,用于判断输入是否在minmax的属性值间;当dataType属性值为Group,且待验证项是多选按钮组时,用于设定多选按钮组的选中个数,判断选中个数是否在[min, max]区间;当daType属性值为Limit时,用于验证输入的字符数是否在[min, max]区间;当daType属性值为LimitB时,用于验证输入字符的字节数是否在[min, max]区间。

语法 msg="string"
类型:字符串。必选。
说明:在验证失败时要提示的出错信息。

语法operator="NotEqual | GreaterThan | GreaterThanEqual | LessThan | LessThanEqual | Equal"
类型:字符串。在dataType属性值为Compare时可选(默认值为Equal)。
说明:参考to属性。
各选值所对应的关系操作符
可选值 意义说明
NotEqual
不等于 !=
GreaterThan
大于 >
GreaterThanEqual
大于等于 >=
LessThan
小于 <
LessThanEqual
小于等于 <=
Equal 等于 =

语法require="true | false"
类型:字符串。可选。
说明:用于设定表单项的验证方式。当值为false时表单项不是必填项,但当有填写时,仍然要执行dataType属性所设定的验证方法,值为true或任何非false字符时可省略此属性。

语法to="sting | int"
类型:字符串。当dataType值为RepeatCompare时必选。
说明:当dataType值为Repeat时,to的值为某表单项的name属性值,用于设定当前表单项的值是否与目标表单项的值一致;当dataType的值为Compare时,to的选值类型为实数,用于判断当前表单项的输入与to的值是否符合operator属性值所指定的关系。

语法format="ymd | dmy"
类型:字符串。在dataType属性值为Date时可选(默认值为ymd)。
说明:用于验证输入是否为符合format属性值所指定格式的日期。
符合规则的输入示例 : 2004-11-232004/11/2304.11.2323-11-2004
注意:当输入的年份为2位时,如果数值小于30,将使年份看作处于21世纪,否则为20世纪。

语法regexp="object"
类型:字符串。在dataType属性值为Custom时必选。
说明:用于验证输入是否符合regexp属性所指定的正则表达式。

示例:

 

 

引用:http://www.phpchina.com/?1133/action_viewspace_itemid_3631.html

http://www.phpchina.com/?8133/action_viewspace_itemid_3214.html

 

 示例是html代码,不会上传,copy过来变成页面了,用帖子回复又可以了。

 

元字符:

/b 代表着单词的开头或结尾,也就是单词的分界处.如果要精确地查找hi这个单词的话,我们应该使用/bhi/b.

.是另一个元字符,匹配除了换行符以外的任意字符,*同样是元字符,它指定*前边的内容可以重复任意次以使整个表达式得到匹配。


.*连在一起就意味着任意数量的不包含换行的字符。

/d是一个新的元字符,匹配任意的数字,0/d/d-/d/d/d/d/d/d/d/d也就是中国的电话号码.为了避免那么多烦人的重复,我们也可以这样写这个表达式:0/d{2}-/d{8}。

/s匹配任意的空白符,包括空格,制表符(Tab),换行符,中文全角空格等。/w匹配字母或数字或下划线或汉字。

/b/w{6}/b 匹配刚好6个字母/数字的单词。

字符转义:使用/来取消这些字符的特殊意义。因此,你应该使用/.和/*。当然,要查找/本身,你也得用//。

  代码     说明
   .  匹配除换行符以外的任意字符
  /w  匹配字母或数字或下划线或汉字
  /s  匹配任意的空白符
  /d  匹配数字
  /b  匹配单词的开始或结束
  ^   匹配字符串的开始
  $   匹配字符串的结束

重复:
常用的限定符
代码/语法  说明
   *  重复零次或更多次
   +  重复一次或更多次
   ?  重复零次或一次
  {n} 重复n次
 {n,} 重复n次或更多次
{n,m} 重复n到m次

要想查找数字,字母或数字,你只需要在中括号里列出它们就行了,像[aeiou]就匹配任何一个元音字母,[.?!]匹配标点符号(.或?或!)

反义:
 常用的反义代码
 代码/语法   说明
   /W   匹配任意不是字母,数字,下划线,汉字的字符
   /S   匹配任意不是空白符的字符
   /D   匹配任意非数字的字符
   /B   匹配不是单词开头或结束的位置
 [^x]   匹配除了x以外的任意字符
      [^aeiou]   匹配除了aeiou这几个字母以外的任意字符


替换:
   正则表达式里的替换指的是有几种规则,如果满足其中任意一种规则都应该当成匹配,具体方法是用|把不同的规则分隔开。
   0/d{2}-/d{8}|0/d{3}-/d{7}这个表达式能匹配两种以连字号分隔的电话号码:一种是三位区号,8位本地号(如010-12345678),一种是4位区号,7位本地号(0376-2233445)。
   /(0/d{2}/)[- ]?/d{8}|0/d{2}[- ]?/d{8}这个表达式匹配3位区号的电话号码,其中区号可以用小括号括起来,也可以不用,区号与本地号间可以用连字号或空格间隔,也可以没有间隔。你可以试试用替换|把这个表达式扩展成也支持4位区号的。
   /d{5}-/d{4}|/d{5}这个表达式用于匹配美国的邮政编码。美国邮编的规则是5位数字,或者用连字号间隔的9位数字。之所以要给出这个例子是因为它能说明一个问题:使用替换时,顺序是很重要的。如果你把它改成/d{5}|/d{5}-/d{4}的话,那么就只会匹配5位的邮编(以及9位邮编的前5位)。原因是匹配替换时,将会从左到右地测试每个分枝条件,如果满足了某个分枝的话,就不会去管其它的替换条件了。

分组:

如果想要重复一个字符串又该怎么办?你可以用小括号来指定子表达式(也叫做分组),然后你就可以指定这个子表达式的重复次数了。
     (/d{1,3}/.){3}/d{1,3}是一个简单的IP地址匹配表达式。要理解这个表达式,请按下列顺序分析它:/d{1,3}匹配1到3位的数字,(/d{1,3}/.}{3}匹配三位数字加上一个英文句号(这个整体也就是这个分组)重复3次,最后再加上一个一到三位的数字(/d{1,3})。不幸的是,它也将匹配256.300.888.999这种不可能存在的IP地址(IP地址中每个数字都不能大于255)。如果能使用算术比较的话,或许能简单地解决这个问题,但是正则表达式中并不提供关于数学的任何功能,所以只能使用冗长的分组,选择,字符类来描述一个正确的IP地址:((2[0-4] /d|25[0-5]|[01]?/d/d?)/.){3}(2[0-4]/d|25[0-5]|[01]?/d/d?)。

后向引用:

后向引用用于重复搜索前面某个分组匹配的文本。例如,/1代表分组1匹配的文本。难以理解?请看示例:
/b(/w+)/b/s+/1/b可以用来匹配重复的单词,像go go, kitty kitty。首先是一个单词,也就是单词开始处和结束处之间的多于一个的字母或数字(/b(/w+)/b),然后是1个或几个空白符(/s+,最后是前面匹配的那个单词(/1)。

懒惰限定符
*? 重复任意次,但尽可能少重复
+? 重复1次或更多次,但尽可能少重复
?? 重复0次或1次,但尽可能少重复
{n,m}? 重复n到m次,但尽可能少重复
{n,}? 重复n次以上,但尽可能少重复

位置指定:


接下来的四个用于查找在某些内容(但并不包括这些内容)之前或之后的东西,也就是说它们用于指定一个位置,就像/b,^,$那样,因此它们也被称为零宽断言。最好还是拿例子来说明吧:

(?=exp)也叫零宽先行断言,它匹配文本中的某些位置,这些位置的后面能匹配给定的后缀exp。比如/b/w+(?=ing/b),匹配以 ing结尾的单词的前面部分(除了ing以外的部分),如果在查找I'm singing while you're dancing.时,它会匹配sing和danc。

(?<=exp)也叫零宽后行断言,它匹配文本中的某些位置,这些位置的前面能给定的前缀匹配exp。比如(?<=/bre)/w+/b会匹配以re开头的单词的后半部分(除了re以外的部分),例如在查找reading a book时,它匹配ading。

假如你想要给一个很长的数字中每三位间加一个逗号(当然是从右边加起了),你可以这样查找需要在前面和里面添加逗号的部分:((?<=/d)/d{3})*/b。请仔细分析这个表达式,它可能不像你第一眼看出来的那么简单。

下面这个例子同时使用了前缀和后缀:(?<=/s)/d+(?=/s)匹配以空白符间隔的数字(再次强调,不包括这些空白符)。

负向位置指定:


前面我们提到过怎么查找不是某个字符或不在某个字符类里的字符的方法(反义)。但是如果我们只是想要确保某个字符没有出现,但并不想去匹配它时怎么办?例如,如果我们想查找这样的单词--它里面出现了字母q,但是q后面跟的不是字母u,我们可以尝试这样:

/b/w*q[^u]/w*/b匹配包含后面不是字母u的字母q的单词。但是如果多做测试(或者你思维足够敏锐,直接就观察出来了),你会发现,如果q出现在单词的结尾的话,像Iraq,Benq,这个表达式就会出错。这是因为[^u]总是匹配一个字符,所以如果q是单词的最后一个字符的话,后面的 [^u]将会匹配q后面的单词分隔符(可能是空格,或者是句号或其它的什么),后面的/w+/b将会匹配下一个单词,于是/b/w*q[^u]/w*/b 就能匹配整个Iraq fighting。负向位置指定能解决这样的问题,因为它只匹配一个位置,并不消费任何字符。现在,我们可以这样来解决这个问题:/b/w*q(?!u) /w*/b。

零宽负向先行断言(?!exp),只会匹配后缀exp不存在的位置。/d{3}(?!/d)匹配三位数字,而且这三位数字的后面不能是数字。

同理,我们可以用(?<!exp),零宽负向后行断言来查找前缀exp不存在的位置:(?<![a-z])/d{7}匹配前面不是小写字母的七位数字(实验时发现错误?注意你的“区分大小写”先项是否选中)。

一个更复杂的例子:(?<=<(/w+)>).*(?=<///1>)匹配不包含属性的简单HTML标签内里的内容。(<?(/w+)>)指定了这样的前缀:被尖括号括起来的单词(比如可能是<b>),然后是.*(任意的字符串),最后是一个后缀(?=<///1>)。注意后缀里的//,它用到了前面提过的字符转义;/1则是一个反向引用,引用的正是捕获的第一组,前面的(/w +)匹配的内容,这样如果前缀实际上是<b>的话,后缀就是</b>了。整个表达式匹配的是<b>和< /b>之间的内容(再次提醒,不包括前缀和后缀本身)。

注释:
小括号的另一种用途是能过语法(?#comment)来包含注释。例如:2[0-4]/d(?#200-249)|25[0-5](?#250-255)|[01]?/d/d?(?#0-199)。

要包含注释的话,最好是启用“忽略模式里的空白符”选项,这样在编写表达式时能任意的添加空格,Tab,换行,而实际使用时这些都将被忽略。启用这个选项后,在#后面到这一行结束的所有文本都将被当成注释忽略掉。

例如,我们可以前面的一个表达式写成这样:

      (?<=    # 查找前缀,但不包含它
      <(/w+)> # 查找尖括号括起来的字母或数字(标签)
      )       # 前缀结束
      .*      # 匹配任意文本
      (?=     # 查找后缀,但不包含它
      <///1>  # 查找尖括号括起来的内容:前面是一个"/",后面是先前捕获的标签
      )       # 后缀结束


贪婪与懒惰:
当正则表达式中包含能接受重复的限定符(指定数量的代码,例如*, {5,12}等)时,通常的行为是(在使整个表达式能得到匹配的前提下)匹配尽可能多的字符。考虑这个表达式:a.*b,它将会匹配最长的以a开始,以b 结束的字符串。如果用它来搜索aabab的话,它会匹配整个字符串aabab。这被称为贪婪匹配。

有时,我们更需要懒惰匹配,也就是匹配尽可能少的字符。前面给出的限定符都可以被转化为懒惰匹配模式,只要在它后面加上一个问号?。这样.*?就意味着匹配任意数量的重复,但是在能使整个匹配成功的前提下使用最少的重复。现在看看懒惰版的例子吧:

a.*?b匹配最短的,以a开始,以b结束的字符串。如果把它应用于aabab的话,它会匹配aab和ab(为什么第一个匹配是aab而不是ab?简单地说,最先开始的区配最有最大的优先权??The Match That Begins Earliest Wins)。

表5.懒惰限定符 *? 重复任意次,但尽可能少重复
+? 重复1次或更多次,但尽可能少重复
?? 重复0次或1次,但尽可能少重复
{n,m}? 重复n到m次,但尽可能少重复
{n,}? 重复n次以上,但尽可能少重复

-------------------------------------------------------

下面是一些常用的正则表达式:

匹配中文字符的正则表达式: [/u4e00-/u9fa5]
评注:匹配中文还真是个头疼的事,有了这个表达式就好办了

匹配双字节字符(包括汉字在内):[^/x00-/xff]
评注:可以用来计算字符串的长度(一个双字节字符长度计2,ASCII字符计1)

匹配空白行的正则表达式:/n/s*/r
评注:可以用来删除空白行

匹配HTML标记的正则表达式:<(/S*?)[^>]*>.*?<//1>|<.*? />
评注:网上流传的版本太糟糕,上面这个也仅仅能匹配部分,对于复杂的嵌套标记依旧无能为力

匹配首尾空白字符的正则表达式:^/s*|/s*$
评注:可以用来删除行首行尾的空白字符(包括空格、制表符、换页符等等),非常有用的表达式

匹配Email地址的正则表达式:/w+([-+.]/w+)*@/w+([-.]/w+)*/./w+([-.]/w+)*
评注:表单验证时很实用

匹配网址URL的正则表达式:[a-zA-z]+://[^/s]*
评注:网上流传的版本功能很有限,上面这个基本可以满足需求

匹配帐号是否合法(字母开头,允许5-16字节,允许字母数字下划线):^[a-zA-Z][a-zA-Z0-9_]{4,15}$
评注:表单验证时很实用

匹配国内电话号码:/d{3}-/d{8}|/d{4}-/d{7}
评注:匹配形式如 0511-4405222 或 021-87888822

匹配腾讯QQ号:[1-9][0-9]{4,}
评注:腾讯QQ号从10000开始

匹配中国邮政编码:[1-9]/d{5}(?!/d)
评注:中国邮政编码为6位数字

匹配身份证:/d{15}|/d{18}
评注:中国的身份证为15位或18位

匹配ip地址:/d+/./d+/./d+/./d+
评注:提取ip地址时有用

匹配特定数字:
^[1-9]/d*$    //匹配正整数

分享到:
评论
3 楼 chenlilin6391210 2012-05-22  
         
2 楼 xhp317 2007-01-16  
顶一下
1 楼 xiaolan02 2006-12-29  
<scrīpt src="./Js/validator.js"></scrīpt>
<form name="middle_price" action="index.php" method="post" id="middle_price" ōnSubmit="return Validator.Validate(this,3)">
<table width="595" height="244" border="1" align="left" cellpadding="0" cellspacing="1" bgcolor="#C9C9C9">
  <tr>
    <th height="15" colspan="2" align="center" bgcolor="#837B6D" class="style1">&nbsp;</th>
  </tr><!--单张印刷报价-->
  <tr>
    <td width="153" height="23" align="right">数量(张)</td>
    <td width="448">
   <select name="paper_num" dataType="Require" msg="未选定数量">
      <option value="" selected>请选择</option>
   <option value="200">200</option>
   <option value="500">500</option>
   <option value="1000">1000</option>
   <option value="2000">2000</option>
   <option value="3000">3000</option>
   <option value="5000">5000</option>
   <option value="10000">10000</option>
   <option value="zdy">自定义</option>  
   </select>
  </td>
  </tr>
  <tr>
    <td height="23" align="right">纸张厚度(克)</td>
    <td>
   <select name="paper_thinckness" dataType="Require" msg="未选定纸张厚度">
      <option value="" selected>请选择</option>
   <option value="80">80</option>
   <option value="90">90</option>
   <option value="95">95</option>
   <option value="100">100</option>
   <option value="105">105</option>
   <option value="120">120</option>
   <option value="128">128</option>
   <option value="150">150</option>
   <option value="157">157</option>
   <option value="180">180</option>
   <option value="200">200</option>
   <option value="zdy">自定义</option>
   </select>
</td>
  </tr>
  <tr>
    <td height="18" align="right">纸张类型</td>
    <td>
   <select name="paper_type" dataType="Require" msg="未选定纸张类型">
      <option value="" selected>请选择</option>
      <option value="特种纸">特种纸</option>
   <option value="单面铜版纸">单面铜版纸</option>
   <option value="双面铜版纸">双面铜版纸</option>
   <option value="哑粉纸">哑粉纸</option>
   <option value="双胶纸(胶版纸)">双胶纸(胶版纸)</option>
   <option value="轻涂纸">轻涂纸</option>
   <option value="新闻纸">新闻纸</option>
   <option value="信封纸 (牛皮纸)">信封纸 (牛皮纸)</option>
   <option value="不干胶">不干胶</option>
       </select>
</td>
  </tr>
  <tr>
    <td height="18" align="right">纸张尺寸(长X宽/厘米)</td>
    <td>
   长<input name="paper_width" type="text" size="4" width="25" dataType="Double" msg="纸张尺寸-长度,请用数字">
      X宽<input name="paper_height" type="text" size="4" width="25" dataType="Double" msg="纸张尺寸-宽度,请用数字">
      厘米
</td>
  </tr>
  <tr>
    <td height="16" align="right">印刷颜色</td>
    <td>
   <input type="radio" name="print_color" value="单面(4+0)">单面(4+0)&nbsp;&nbsp;
      <input type="radio" name="print_color" value="双面(4+4)" dataType="Group" msg="必须选择一个印刷颜色">双面(4+4)
</td>
  </tr>
  <tr>
    <td height="18" align="right">总价(元)</td>
    <td><input type="text" name="price_total" size="10" dataType="Currency" msg="总价请用数字">
      <input type="checkbox" name="show_price" value="1">显示<!--1显示,0 不显示--></td>
  </tr>
  <tr>
    <td height="18" align="right">备注</td>
    <td><textarea name="notes" cols="30" rows="4"></textarea></td>
  </tr>
  <tr>
    <td height="15" colspan="2" align="center">
    <input type="submit" name="Submit" value="提交报价">
      </td>
    </tr>
</table>
</form>

相关推荐

    js表单验证Validator.js

    **JavaScript表单验证库——Validator.js** `Validator.js` 是一个专为JavaScript设计的轻量级表单验证库,主要用于增强HTML表单的验证功能,确保用户输入的数据符合预设的规则。它允许开发者在客户端进行实时数据...

    validator.js-2.0.0.zip

    `validator.js-2.0.0.zip`是一个包含JavaScript验证库的压缩文件,该库名为`js-validator`,它借鉴了流行的PHP框架Laravel的验证风格。`js-validator`主要功能在于提供对JavaScript对象和表单输入数据的有效性检查,...

    基于[我佛山人validator.js]的验证框架

    【基于我佛山人validator.js的验证框架】 在前端开发中,数据验证是不可或缺的一部分,它确保用户输入的数据符合预设的规则,从而提高系统的稳定性和安全性。`validator.js` 是一款由“我佛山人”开发的轻量级验证...

    Validator.js

    综上所述,Validator.js是一个强大的JavaScript验证库,通过其丰富的验证规则、自定义错误消息和异步验证功能,能够有效地提升Web应用的数据管理质量。结合`validator.chm`文档,开发者可以更加高效地利用这个工具...

    JavaScript对象验证库js-validator.zip

    验证validator.validate(object_to_be_tested, rules);如果待验证对象符合规则,validate函数返回true;否则返回带有验证状态、失败的属性和对应失败的规则信息的对象。添加验证器使用add方法为Validator添加验证器...

    前端开发原生表单校验validator.js-13.11.0

    `validator.js` 是一个流行且强大的JavaScript库,专注于处理前端表单验证。在13.11.0这个版本中,`validator.js` 提供了丰富的功能和优化,帮助开发者更便捷地实现表单数据的验证。 首先,`validator.js` 的核心...

    validator.js

    Validator是基于JavaScript技术的伪静态类和对象的自定义属性,可以对网页中的表单项输入进行相应的验证,允许同一页面中同时验证多个表单,熟悉接口之后也可以对特定的表单项甚至仅仅是某个字符串进行验证。...

    前端项目-validator.zip

    为了在项目中使用 `validator.js`,开发者需要先将其导入到他们的 JavaScript 文件中,然后就可以调用各种验证和净化方法。例如: ```javascript // 导入库 const { isEmail, isMobilePhone, whitelist } = require...

    validator js效果

    `Validator.js`是一个非常实用的JavaScript验证库,用于在前端进行数据验证,确保用户输入的数据符合预期格式,从而提升用户体验并减少服务器端的压力。在网页表单中,它可以帮助我们实时检测并显示错误信息,无需...

    bootstrapValidator.min.js表单验证插件

    这通常包括jQuery库(在这里是`jquery-1.11.3.js`)和BootstrapValidator的JavaScript文件(`bootstrapValidator.min.js`)。在给定的描述中,可以看到这些文件被放置在`&lt;script&gt;`标签内,并且应当按照正确的顺序...

    表单验证类 Validator JS 及文档 示例代码

    Validator JS是一个专门用于前端表单验证的JavaScript库,它利用正则表达式来实现复杂的数据校验。下面将详细介绍Validator JS的使用、功能以及示例代码。 首先,Validator JS的核心是它的验证类。这个类提供了多种...

    js_Validator.rar一个验证表单域的东东

    `js_Validator.rar`提供的`Validator`类就是一个用于简化这一过程的工具,帮助开发者更高效地处理表单验证。 ### 表单验证的重要性 表单验证的重要性主要体现在以下几个方面: 1. **用户体验**:通过前端验证,...

    js验证Validator,我是佛山人

    【标题】"js验证Validator,我是佛山人"指的是一个基于JavaScript的验证工具,可能是由一位来自佛山的开发者创建的。这个验证器(Validator)可能是为了帮助前端开发人员更方便、高效地实现表单数据的验证。 【描述...

    validator轻量级的JavaScript表单验证字符串验证没有依赖支持UMD3kb

    `validator.js`是一个轻量级的JavaScript库,专门用于实现表单验证和字符串验证功能。在Web开发中,表单验证是确保用户输入数据有效性和安全性的关键环节,`validator.js`为此提供了一套简洁而强大的解决方案。这个...

    commons-validator.doc 用法介绍

    为了实现客户端验证,Commons Validator会在服务器端验证成功的基础上,通过JavaScript生成相应的验证代码。这通常涉及到以下步骤: 1. 引入`StaticJavascript.jsp`,这是一个包含验证函数的JavaScript文件。 2. ...

    jQuery validator addMethod 根据不同情况显示不同错误信息

    `jQuery validator addMethod`是jQuery Validation Plugin中的一个关键功能,允许开发者自定义验证方法。当你发现内置的验证规则不能满足特定需求时,可以利用这个方法创建自己的验证逻辑。下面我们将详细介绍其用法...

    validator.js:轻量级的 JavaScript 表单验证,字符串验证。没有依赖,支持 UMD ,~3kb

    validator轻量级JavaScript表单验证,字符串验证。没有依赖,支持UMD,~3kb。安装使用模块在应用中引用 validator.min.js 文件# npm 安装$ npm install validator.tool --save# bower 安装$ bower info validator....

    dcat-validator.js:nodejs库来验证DCAT文件

    browserify -r ./validator.js:validate &gt; ./build/dcat-validator.bundle.js 用法 记录错误和警告 如果要使用此库而不进行任何更改,只需在build文件夹中获取dcat-validator.bundle.js文件,然后使用以下代码。 ...

    bootStrapValidator

    要使用BootstrapValidator,首先需要在HTML中引入Bootstrap和BootstrapValidator的CSS及JS文件,然后在表单上添加相应的验证规则,最后通过JavaScript初始化验证器。例如: ```html &lt;!DOCTYPE html&gt; ...

    bootstrap、bootstrapValidator和jquery相关的部分js和css

    BootstrapValidator的CSS和JS文件(如`bootstrapValidator.css`和`bootstrapValidator.js`)则负责表单验证的样式和逻辑。为了提高页面加载速度,通常会将这些文件进行合并和压缩,如`bootstrap.min.css`和`...

Global site tag (gtag.js) - Google Analytics