html:

<form id="reg" action="123.html">
<p class="myerror"></p>
<p>帐号:<input type="text" name="user" id="user" /></p>
<p>密码:<input type="text" name="pass" id="pass" /></p>
<p>邮编:<input type="text" name="code" id="code" /></p>
<p><input type="submit" value="提交" /></p>
</form>

css:(部分)

.valid {
  background:url(../img/reg_succ.png) no-repeat right;//图片为成功的
}

js:

$(function () {
  //自定义验证规则
  $.validator.addMethod(
    "code",
    function(value,element){
      var tel=/^[0-9]{6}$/;
      return this.optional(element) || (tel.test(value));
    },
    "请输入正确的邮政编码!"
  );
  //插件验证
  $('#reg').validate({
    submitHandler : function (form) {
      alert('验证成功,准备提交!');
    },
    rules:{
      user:{
         required:true,
         minlength:6
      },
      pass:{
         required:true,
         minlength:6
      },
      code:{
        required:true,
        code:true
      }
    },
    messages:{
      user:{
        required:"用户名不为空!",
        minlength:"最小长度不少于6位"
      },
      pass:{
        required:"密码不为空!",
        minlength:"最小长度不少于6位"
      },
     code:{
       required:"邮箱不为空"
     }
   }
})
});

效果图:

jquery的validate表单验证的更多相关文章

  1. 基于jQuery的Validate表单验证

    表单验证可以说在前端开发工作中是无处不在的~ 有数据,有登录,有表单, 都需要前端验证~~  而我工作中用到最多的就是基于基于jQuery的Validate表单验证~  就向下面这样~ 因为今天有个朋 ...

  2. jQuery:validate表单验证基本使用

    jquery.validate是jquery的一个验证框架,可以迅速验证一些常见的输入,并且可以自己扩充自己的验证方法! 这里先从介绍简单的使用方法:jquery.validate.js下载地址 1. ...

  3. ASP.NET MVC Jquery Validate 表单验证的多种方式

    在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...

  4. [转]ASP.NET MVC Jquery Validate 表单验证的多种方式介绍

    在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...

  5. Jquery Validate 表单验证的多种方式

    ASP.NET MVC Jquery Validate 表单验证的多种方式 在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体 ...

  6. jquery.validation.js 表单验证

    jquery.validation.js 表单验证   官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuer ...

  7. jQuery-easyui和validate表单验证实例

    jQuery EasyUI 表单 - 表单验证插件validatebox 使用时需要向页面引入两个css文件如下: <link rel="stylesheet" href=& ...

  8. jQuery Validation Engine 表单验证,自定义规则验证方法

    jQuery Validation Engine 表单验证说明文档http://code.ciaoca.com/jquery/validation-engine/ js加到jquery.validat ...

  9. validate表单验证-单独验证

    今天编写一个表单验证程序,我来说一下今天遇到的坑:程序不是通过submit按钮提交验证的,是在自己写的一个方法中提交的,出现了表单无法验证的情况.然后我就了解了一下jquery validate的验证 ...

随机推荐

  1. C# WINFORM 打包数据库

    实现效果:安装项目时直接附加数据库. 1.首先在需要部署的项目的解决方案资源管理器中新建一个安装项目   2.在安装项目的文件视图中,右键[应用程序文件夹]->[添加]->[项目输出]   ...

  2. 第六次Scrum冲刺

    第六次Scrum冲刺 1.成员今日完成情况 队员 今日完成任务 刘佳 前端构建 李佳 后端设计 周世元 数据设计 杨小妮 博客编写 许燕婷 管理团队当日及次日任务 陈水莲 性能测试用例设计 曾丽丽 性 ...

  3. Hibernate学习笔记3.1(Hibernate关系映射)

    主要指对象之间的关系 1.一对一关联 一对一单项外键关联 比如说一夫一妻 Wifi.java package com.bjsxt.hibernate; import javax.persistence ...

  4. MongoDB常用查询,排序,group,SpringDataMongoDB update group

    MongoDB查询 指定查询并排序 db.getCollection('location').find({"site.id":"川A12345","s ...

  5. js高级-原型链

    JavaScript是基于原型的面向对象的语言(相当于一个基类,父类),而不是像Java通过类模板构造实例,通过原型实现属性函数的复用 函数都有 prototype属性 指向函数的原型对象 只有函数根 ...

  6. OpenCV 调用双摄像头

    #include <opencv2/opencv.hpp> #include<iostream> using namespace cv; using namespace std ...

  7. java.lang.IllegalArgumentException: Missing either @POST URL or @Url parameter.

    以前联调的接口,都是类似这样子的http://ip:8080/WLInterface/register   在baseUrl(http://ip:8080/WLInterface/register ) ...

  8. python进程之守护进程

    标签(空格分隔): 守护进程 主进程创建子进程,然后将该进程设置成守护自己的进程,守护进程就好比崇祯皇帝身边的老太监,崇祯皇帝已死老太监就跟着殉葬了: 关于守护进程需要强调两点: 其一:守护进程会在主 ...

  9. meta标签的使用

    meta标签是html标记head区的一个关键标签,它位于HTML文档的<head>和<title>之间(有些也不是在<head>和<title>之间) ...

  10. js 创建对象的几种方法

    1. 使用object创建 var person = new Object(); person.name = "Tom"; person.age = "29"; ...