在一个验证form的实例中扩展jQuery.validate

 需求很简单,直接上图:

要验证表单上的3个input输入框的格式,要求如下:

主关键词情形1:  浙江 杭州 温州

主关键词情形2:  浙江|江苏|上海,但是不能用 空格和 | 混合用,也就是情形1和2不能混合

“或”关键词:  教育|中学|小学

“非”关键词:  校长-教授-大学

另外,主关键词+或关键词的个数不能大于10个

    非关键词个数不限制

原创文章,转载请注明:http://www.cnblogs.com/phpgcs/


这里用了  jQuery.validate.js

  2             //main keyword validate
  1             //user can input words with backspace or | splited
  0             $.validator.addMethod("kw_main_validate", function(value, element){                                                                                     
  1                 var kwmain = /^([\u4e00-\u9fa5a-zA-Z0-9]{1,10}\s?){1,10}$|^([\u4e00-\u9fa5a-zA-Z0-9]{1,10}\|?){1,10}$/;
  2                 //full match ,use ^ and $
  3                 return kwmain.test(value);
  4             })
  5             //or keyword validate
  6             //user can input words with | splited
  7             $.validator.addMethod("kw_or_validate", function(value, element){
  8                 var kwmain = /^([\u4e00-\u9fa5a-zA-Z0-9]{1,10}\|?){1,10}$/;
  9                 return kwmain.test(value);
 10             })
 11             //not keyword validate
 12             //user can input words with - splited
 13             $.validator.addMethod("kw_not_validate", function(value, element){
 14                 var kwmain = /^([\u4e00-\u9fa5a-zA-Z0-9]{1,10}\-?){1,10}$/;
 15                 return kwmain.test(value);
 16             })
 17             //main kw + or kw <= 10
 18             $.validator.addMethod("checkMax10", function(value, element){
 19                 var main_string = $('#keyword_main').val();
 20                 var or_string = $('#keyword_or').val();
 21                 var main_num = main_string.split(/[\s\|]/).length;
 22                 var or_num = or_string.split(/[\s\|]/).length;
 23                 return ((main_num+or_num-10)>0)?false:true;
 24             })


  1                 rules: {
  5                     keyword_main: {
  6                         required: true,
  7                         kw_main_validate: true,
  8                         checkMax10: true
  9                     },
 13                     keyword_or: {
 14                         kw_or_validate: true,
 15                         checkMax10: true
 16                     },
 17                     keyword_not: {
 18                         kw_not_validate: true
 19                     },
 20                 },


 21                 messages: {
 14                     keyword_main: {
 13                         required: "请填写关键词",
 12                         kw_main_validate: "请检查输入的关键词用空格或者“|”隔开,不可混用",
 11                         checkMax10: "主关键词和或关键词总数不能超过10个"
 10                     },
  9                     keyword_or: {
  8                         kw_or_validate: "输入的关键词用“|”隔开",
  7                         checkMax10: "主关键词和或关键词总数不能超过10个"
  6                     },
  5                     keyword_not: {
  4                         kw_not_validate: "输入的关键词用“-”隔开"
  3                     },
  2                 },

字符串全匹配 string full match

^abc$

一个在线正则工具:http://tool.chinaz.com/regex,就是用的全匹配

 参考文章:http://topmanopensource.iteye.com/blog/568593

 


update 2014 04 11

bug: 或 关键词和 非 关键词不是必填的项目,需要 if(value)... else return true;

 

  5             //or keyword validate
  6             //user can input words with | splited
  7             $.validator.addMethod("kw_or_validate", function(value, element){
  8                 if(value){
  9                     var kwmain = /^([\u4e00-\u9fa5a-zA-Z0-9]{1,10}\|?){1,10}$/;
 10                     return kwmain.test(value);
 11                 }else{
 12                     return true;
 13                 }
 14             })
 15             //not keyword validate
 16             //user can input words with - splited
 17             $.validator.addMethod("kw_not_validate", function(value, element){
 18                 if(value){
 19                     var kwmain = /^([\u4e00-\u9fa5a-zA-Z0-9]{1,10}\-?){1,10}$/;
 20                     return kwmain.test(value);
 21                 }else{
 22                     return true;
 23                 }
 24             })

  

 

posted @ 2014-03-05 13:28  phpgcs  阅读(588)  评论(0编辑  收藏  举报