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

  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="author" content="http://www.softwhy.com/" />
  6. <title>嗖嗖嗖</title>
  7. <style>
  8. ul li{
  9.   list-style:none;
  10.   margin-top:5px;
  11. }
  12. label.success {
  13.   color:green;
  14. }
  15. </style>
  16. <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
  17. <script src="http://www.softwhy.com/demo/jQuery/js/jquery.validate.js"></script>
  18. <script src="http://www.softwhy.com/demo/jQuery/js/messages_zh.js"></script>
  19. <script>
  20. $(document).ready(function () {
  21.   $("#myform").validate({
  22.     success: function (succ, element) {    //验证成功后执行的代码
  23.       if (element.name == "username") {
  24.         succ.text("你的名字真好听").addClass("success");
  25.       } else if (element.name == "pw") {
  26.         succ.text("你的密码真安全").addClass("success");
  27.       } else {
  28.         succ.text("邮箱是正确的").addClass("success");
  29.       }
  30.     },
  31.     rules: {
  32.       username: "required",
  33.       pw: "required",
  34.       email: "required"
  35.     },
  36.     messages: {
  37.       name: "用户名是必填项目",
  38.       pw: "密码是必填项目",
  39.       email: {
  40.         required: "邮箱是必填项目",
  41.         email:"邮箱格式不正确"
  42.       }
  43.     }
  44.   });
  45. });
  46. </script>
  47. </head>
  48. <body>
  49. <form id="myform">
  50.   <ul>
  51.     <li>姓名:<input type="text" name="username"/></li>
  52.     <li>密码:<input type="password" name="pw"/></li>
  53.     <li>邮箱:<input type="text" name="email"/></li>
  54.     <li>
  55.       <input type="submit" value="提交"/>
  56.       <input type="reset" value="重置"/>
  57.     </li>
  58.   </ul>
  59. </form>
  60. </body>
  61. </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. Abp添加新的Api(不扩展底层方法)

    定义新的实体类:FileManage;继承 FullAuditedEntity<Guid> 在XX.Application 中定义IXXservice及实现XXservice public ...

  2. window10提交代码到码云

    1.创建项目文件夹,例如创建一个"爬虫项目码云仓库" 2.进入项目文件夹,在地址栏输入cmd然后回车,这样就在该文件夹打开了终端 3.终端输入git init初始化项目仓库,此时会 ...

  3. wex5 file文件存储

    在js中需要引入file的cordova包 require("cordova!cordova-plugin-file"); 如果要存到手机的根目录下,在Native文件夹的对应项目 ...

  4. 记一些使用mpvue时遇到的问题

    一.在mpvue中使用vuex(和在vue中使用不同) 1.vue中使用vuex,在main.js中: import store from './store' new Vue({ store })   ...

  5. linux上如何安装postgresql

    安装对应的postgresql的yum源 rpm -Uvh https://download.postgresql.org/pub/repos/yum/9.4/redhat/rhel-7-x86_64 ...

  6. linux系统使用grep命令提取文件的基名或者路径名

    效果等于~]#dirname /etc/sysconfig/network-scripts/ifcfg-ens33 echo "/etc/sysconfig/network-scripts/ ...

  7. Windows10永久激活的工具

    最近发现一个很好用的Windows10 永久激活的工具,比KMS什么的管用,而且无毒无公害.几乎支持所有的win10版本.感兴趣的朋友可以试试.之前win10没洗白的同学,也试试吧,说不定就洗白了呢. ...

  8. GO （待更新）

    日期20190531,GO AND TOOLS FOR HOME 0  环境搭建 https://golang.org/dl/ Install the Go tools If you are upgr ...

  9. 查看Spring MVC 父容器和子容器的对象的实例

    话不多说,直接上案例 package com.oukele.web; import org.springframework.beans.factory.annotation.Autowired; im ...

  10. [洛谷P2605] ZJOI2016 基站选址

    问题描述 有N个村庄坐落在一条直线上,第i(i>1)个村庄距离第1个村庄的距离为Di.需要在这些村庄中建立不超过K个通讯基站,在第i个村庄建立基站的费用为Ci.如果在距离第i个村庄不超过Si的范 ...