在线客服,智能在线客服,在线客服系统,客服机器人,智能客服,智能机器人客服,电商客服系统,智慧客服,免费电话,微信在线客服,网站在线客服软件,网络营销电话,手机在线客服,微客服,快商通

咨询热线:400-027-0592 

不用javascript库的验证表单js-Validatious 2.0

分类:快商学院 时间:2012-09-28 作者:


QQ空间 新浪微博 腾讯微博 更多

 

表单设计和表单验证输入是相当猥琐的一件事了,虽然jquery 的表单验证已经很好了,不过很多地方还要自己写代码,才会另人满意,开始学习时,写写还无所谓,多写几遍,就是多粘帖几次我都受不了,今天我要讲的这个验证是不用js库的,单独一个js,灵活性也很高-validatious。下载v2.standalone.full.min

用法:首先在页面上引入这个js,<input name="downnum" type="text" value="0" title="只能输入数字" class="required numeric" />看到了没,这里的class可以设置该输入框应该满足的条件,这里是必填和只能是数字,title为出错时显示的信息。

内置的有:

'alpha': '${field} should only contain letters',——只能包含字母
  'alphanum': '${field} should only contain letters and numbers',——只能包含字母和数字
  'car-regnum-nor': '${field} should be a valid norwegian auto registration number',——Norwegian的身份证号应该
  'confirmation-of': '${field} should be a confirmation of ${field-id}',
  'email': '${field} should be a valid email address',——请输入有效的邮箱地址
  'max-length': '${field} should be no more than ${max} characters long',——不超过几个字符
  'max-val': '${field} should be no bigger than ${min}',不大于
  'min-length': '${field} should be atleast ${min} characters long',至少
  'min-val': '${field} should be atleast ${min}',最小
  'numeric': '${field} should only contain numbers',只能是数字
  'phone-nor': '${field} should be a valid norwegian phone number',Norwegian的电话
  'required': '${field} is required',必填
  'ssn-nor': '${field} should be a valid norwegian social security number',
  'url': '${field} should be a valid URL',url
  'word': '${field} should only contain letters, numbers and punctuation'
});

  displayErrors: -1,          // How many error messages to display per item
                              // Default is -1 = all messages
  positionErrorsAbove: true,  // Whether to display error messages above item
                              // (true - default) or below (false)
  failureClass: 'error',      // Class name to append to the parent element
                              // when validation fails
  successClass: '',           // Class name to append to the parent element
                              // when validation succeeds
  messagesClass: 'messages',  // Class name used on error lists

要让出错信息显示为红色,只要在css内定义,.error{color:red;}就可以了

返回列表>>

上一篇:web2.0大航海时代

下一篇:asp网页源文件首行空白行


相关新闻

80%的运营其实只是个运行

十个策划技巧助力企业网站优化

分享企业网站内部链接优化的六个小技巧

传统企业互联网转型必须做好这五点

浅谈提高搜索引擎优化效率的三个技巧

客服一对一服务
30万成功案例
CCTV央视特别报道
国家高新技术企业
全国统一咨询热线:400-027-0592