大多数时候我们使用validate进行前台验证的时候，都是验证错误的时候给出提示信息，最近在做一个项目的时候，想这验证成功后给出一个验证成功的提示。于是在网上找了一些资料。

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<meta name="author" content="http://www.softwhy.com/" />

<title>嗖嗖嗖</title>

<style>

ul li{

  list-style:none;

  margin-top:5px;

}

label.success {

  color:green;

}

</style>

<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>

<script src="http://www.softwhy.com/demo/jQuery/js/jquery.validate.js"></script>

<script src="http://www.softwhy.com/demo/jQuery/js/messages_zh.js"></script>

<script>

$(document).ready(function () {

  $("#myform").validate({

    success: function (succ, element) {    //验证成功后执行的代码

      if (element.name == "username") {

        succ.text("你的名字真好听").addClass("success");

      } else if (element.name == "pw") {

        succ.text("你的密码真安全").addClass("success");

      } else {

        succ.text("邮箱是正确的").addClass("success");

      }

    },

    rules: {

      username: "required",

      pw: "required",

      email: "required"

    },

    messages: {

      name: "用户名是必填项目",

      pw: "密码是必填项目",

      email: {

        required: "邮箱是必填项目",

        email:"邮箱格式不正确"

      }

    }

  });

});

</script>

</head>

<body>

<form id="myform">

  <ul>

    <li>姓名:<input type="text" name="username"/></li>

    <li>密码:<input type="password" name="pw"/></li>

    <li>邮箱:<input type="text" name="email"/></li>

    <li>

      <input type="submit" value="提交"/>

      <input type="reset" value="重置"/>

    </li>

  </ul>

</form>

</body>

</html>

参考目录：http://www.softwhy.com/article-249-1.html

jQuery Validate 验证成功时的提示信息的更多相关文章

  1. jquery validate验证remote时的多状态问题

    因为远程验证用户名时可能会出现几种错误情况: 1.用户名字符非法: 2.长度超限: 3.用户名已经存在: 但remote返回的内容只能是布尔型的,即使用dataFilter来过滤也不知道如何对应的把错 ...

  2. jQuery Validate验证框架与 jQuery ajaxSubmit的联合使用

    jQuery Validate验证框架自定义验证 第一步导入导入js库 <script src="<%=basePath%>static/js/jquery.js" ...

  3. jquery.validate验证表单配合回调提交和h5.storage本地保存笔记

    表单验证插件我使用:jquery.validate.js 支持中文提示,可扩展性强!教程地址 本地保存状态信息使用:h5提供的storage,浏览器支持5m的存储量,存储类型必须是string类型,并 ...

  4. jQuery Validate验证框架详解，提交前验证

    现在都用h5表单进行验证了,以下方式仅做回忆 https://www.runoob.com/jquery/jquery-plugin-validate.html <!DOCTYPE HTML P ...

  5. jQuery Validate验证框架详解

    转自:http://www.cnblogs.com/linjiqin/p/3431835.html jQuery校验官网地址:http://bassistance.de/jquery-plugins/ ...

  6. jquery.validate 验证机制

    jquery.validate 验证机制 金刚 juqery juqery.validate 在开发系统时,使用了jquery.validate.js 这个验证插件,来校验数据合法性 重点 验证是以i ...

  7. 弹出框页面中使用jquery.validate验证控件

    弹出框页面中使用jquery.validate验证控件有几个问题需要解决: 1,弹出框的提交事件完成后如何关闭弹出框页面? 2,提交不成功如何返回当前页? 3,如果知道验证事件成功? 之前笔者都是JS ...

  8. 【转】jQuery Validate验证框架详解

    jQuery校验官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation 一.导入js库 <script type=& ...

  9. jQuery.Validate 验证,以及 remote验证, 多参数传递

    jQuery.Validate 验证: http://www.runoob.com/jquery/jquery-plugin-validate.html 教程网址,很简单, 今天主要在这里记录一下re ...

随机推荐

  1. Nginx(高并发)

    Nginx(engine x)高性能和反向代理的web服务器反向代理:保护客户资源,只要是http协议都可以Web服务器:IIS 阿帕奇 NginxNginx可以作为负载均衡(NLB只支持Http)我 ...

  2. luogu P2154 [SDOI2009]虔诚的墓主人

    luogu 下面记一个点上下左右点数分别为\(u_i,d_i,l_i,r_i\) 枚举每个中间点太慢了,考虑枚举两个点之间横的一条线段,这里面的点左边点数目都相同,右边点数目都相同,然后只要查一下区间 ...

  3. 这38个小技巧告诉你如何快速学习MySQL数据库

    1.如何快速掌握MySQL? ⑴培养兴趣兴趣是最好的老师,不论学习什么知识,兴趣都可以极大地提高学习效率.当然学习MySQL 5.6也不例外.⑵夯实基础计算机领域的技术非常强调基础,刚开始学习可能还认 ...

  4. spring基于注解的IoC以及IoC的案例

    1.Spring中IoC的常用注解 1.1明确: (1)基于注解的配置和xml的配置要实现的功能都是一样的,都是要降低程序之间的耦合,只是配置的形式不一样 2.案例:使用xml方式和注解方式实现单表的 ...

  5. spring boot入门与进阶教程

    SpringBoot入门.SpringBoot进阶.Spring Cloud微服务.Spring Ecosystem 微服务相关.Spring Boot 入门 IDEA 版本.Spring Boot集 ...

  6. JQuery——关于CDN（内容分发网络）

    替代方案 如果您不希望下载并存放 jQuery,那么也可以通过 CDN(内容分发网络) 引用它. Staticfile CDN.百度.又拍云.新浪.谷歌和微软的服务器都存有 jQuery . 如果你的 ...

  7. 一文搞懂网络知识，IP、子网掩码、网关、DNS、端口号

    网络的基本概念 客户端:应用 C/S(客户端/服务器) B/S(浏览器/服务器) 服务器:为客户端提供服务.数据.资源的机器 请求:客户端向服务器索取数据 响应:服务器对客户端请求作出反应,一般是返回 ...

  8. Hyperledger Fabric 环境搭建（1）

    1,Fabric的程序模块组成 Fabric不是一个单独的程序而是由一组模块组成,这些模块中的每一个都是一个可独立运行的可执行文件. (1)peer 主节点模块,负责存储区块链数据,运行维护链码: ( ...

  9. linux pip使用国内源

    最近在Linux里面使用pip安装应用的速度十分的慢,于是便上网找了一些国内的源. 清华大学:https://pypi.tuna.tsinghua.edu.cn/simple 阿里云:https:// ...

  10. SQL SERVER 查询被锁的表、解锁表

    -- 查询被锁的表select   request_session_id   spid,OBJECT_NAME(resource_associated_entity_id) tableName   f ...