接上一篇

2）messages

提示：修改默认的提示信息最简单的方法是引入message_zh.js文件即可！

如果需要在validate()方法内提示则可以使用本选项

类型：Object

说明：自定义的提示信息，key：value形式，key是要验证的元素，valule可以是字符串或者函数

使用：message：{

username："请输入你的用户名"

filed2:{

required:'必须填写这个字段'，

email:'请添加一个正确的邮箱格式'

}

}

//和上面填写rules是一样的

submitHandler

类型：Function(form)

说明：通过验证后运行的函数，默认添加该函数则不会再提交除非手动提交或者使用return true,

函数类型：该函数接受一个参数表示当前DOM对象

invalidHandler

类型：Function(event,validator)

说明：当一个无效的表单(即验证不通过的时候)被提交的时候触发这个函数。

函数参数：当前验证的表单validator对象

errorClass(默认值error)

类型:String

说明:指定错误提示与验证不通过的控件的Css类名

6) validClass(默认值：'valid')

类型：String

说明：在验证成功的控件上加上传入的CSS类

7)errorElement(默认值：lable)

类型：String

说明：用什么标签标记错误div或者span或者label

8)errorPlacement（默认值：在 无效的元素之后），

9) errorContainer

类型：选择器字符串

说明：有错误信息出现时把选择器匹配的元素变为显示，无错误时隐藏

10) errorLableContainer

类型：选择器字符串

说明：把错误信息统一放在一个容器里面

11) wrapper

类型：String

说明：用什么标签再把上边的errorElement包起来

11) success

类型：String or function（label，element）

说明：每个字段验证通过执行函数

函数参数：

　　label：信息提示标签的Jquery对象。

　　element:当前验证成功的DOM元素对象

　　如果跟一个字符串会作为CSS类加在提示信息的标签上

　　重点用于修改提示信息

12 highlight(默认值：添加errorClass到验证失败的表单控件)

类型：function(element,errorClass,validClass)

说明：传入的函数会在每个控件验证不通过时执行，我们可以通过这个配置属性，给验证不通过的加写效果。

函数参数：

　　　　element：当前未通过验证的Dom元素对象

　　　　errorClass: 错误时给错误提示标签的css类名称

　　　　validClass: validClass属性的当前值

14）unhighlight(默认值：移除验证失败控件的errorClass)（参数同上）

重点：验证通过的表单

15) debug(默认值false)

类型：boolean

设置为true之后则表单不会真正的提交，仅仅是验证！

使用方法以及参数同上，作用相反

16）ignore（默认值：'hidden'）

类型：Selector

说明：忽略某些元素不验证

15）16)在测试时用

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

<script type="text/javascript" src="../js/jquery-1.12.1.js"></script>

<script type="text/javascript" src="../js/validation/jquery.validate.js"></script>

<script type="text/javascript" src="../js/validation/messages_zh.js"></script>

<script type="text/javascript">

    $(document).ready(function()

    {

        $("#form1").validate({

            rules: {

                field1:{

                    required:true,

                    rangelength:[4,6]

                }

            },

            messages:{

                field1:{

                    required:'field1不能为空',

                    rangelength:'field1的长度必须子{0}与{1}之间'

                    /*{0}取的是上述属性的第一个值，{1}取的是上述属性的第二个值  */

                }

            },

            submitHandler:function(form){

                console.log('success');

            },

            invalidHandler:function(event,validator)

            {

                console.log("faile");

            },

            errorClass:'sunshengli',

            validClass:'sifangku',

            errorElement:'label',

            errorPlacement:function($error,element)

            {

            $error.insertBefore(element);

            },

            errorContainer:'#info',

            errorLabelContainer:'#error',

            wrapper:'li',

            success:function($label,element)

            {

                console.log($label);

                console.log(element);

            },

            highlight:function(element,errorClass,validClass){

                $(element).css('background','red');

            },

            unhighlight:function(element,errorClass,validClass){

                 $(element).css('background','#fff');

            }

        });

    });

</script>

<style type="text/css">

form {

    margin: 10px 100px 10px 100px;

}

</style>

</head>

<body>

    <div id="info" style="height: 30px;background: green;display: none">

        出现错误了

    </div>

    <form id="form1">

        <div>

            field1:<input type="text" name="field1" />

        </div>

        <div>

             <input type="submit" name="submit" value="submit"/>

        </div>

    </form>

    <ol id="error"></ol>

</body>

</html>

jquery插件-表单验证插件-提示信息中文化与定制提示信息的更多相关文章

  1. jQuery formValidator表单验证插件

    什么是jQuery formValidator? jQuery formValidator表单验证插件是客户端表单验证插件. 在做B/S开发的时候,我们经常涉及到很多表单验证,例如新用户注册,填写个人 ...

  2. 【锋利的jQuery】表单验证插件踩坑

    和前几篇博文提到的一样,由于版本原因,[锋利的jQuery]表单验证插件部分又出现照着敲不出效果的情况. 书中的使用方法: 1. 引入jquery源文件, 2. 引入表单验证插件js文件, 3. 在f ...

  3. jQuery Validate 表单验证插件----通过name属性来关联字段来验证，改变默认的提示信息，将校验规则写到 js 代码中

    一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二. 添加一个另外一个插件jquery.validate.messages_cn.js. ...

  4. jQuery Validate 表单验证插件----在class属性中添加校验规则进行简单的校验

    一.下载插件包. 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二.jQuery表单验证插件----添加class属性形式的校验 <!DOCTY ...

  5. jquery validate表单验证插件-推荐

    1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家.     1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素  3.鼠标离开后的正确.错误提示及鼠标移入时的帮 ...

  6. jquery validate表单验证插件

    1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家.     1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素  3.鼠标离开后的正确.错误提示及鼠标移入时的帮 ...

  7. jQuery Validate 表单验证插件----Validate简介，官方文档，官方下载地址

     一. jQuery Validate 插件的介绍 jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆 ...

  8. jQuery插件 -- 表单验证插件jquery.validate.js, jquery.metadata.js

    原文地址:http://blog.csdn.net/zzq58157383/article/details/7718352   最常使用JavaScript的场合就是表单的验证,而jQuery作为一个 ...

  9. jQuery插件 -- 表单验证插件jquery.validate.js

    最常使用JavaScript的场合就是表单的验证,而jQuery作为一个优秀的JavaScript库,也提供了一个优秀的表单验证插件----Validation.Validation是历史最悠久的jQ ...

  10. jquery validate表单验证插件的基本使用方法及功能拓展

    1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家.    1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素 3.鼠标离开后的正确.错误提示及鼠标移入时的帮助提 ...

随机推荐

  1. 批量去除Teleport Pro整站下载文件冗余代码

    teleport pro tppabs标签批量删除 teleport pro tppabs标签批量删除 使 用Teleport Pro下载的网页代码中包含了很多垃圾代码,比如下载的html网页代码中会 ...

  2. ASP.NET MVC读取XML并使用ViewData显示

    看到网上一个网友问及,无法获取XML某一个节点内容.下面Insus.NET在ASP.NET MVC环境下实现它. 先把XML文件放入App_Data目录,当然你可以放在自建目录中.打开看看它有几层,几 ...

  3. jboss CLI 命令行接口学习（适用JBOSS EAP 6.2+）

    一.确认CLI所使用的端口 以domain模式为例,查看domain controller(也就是master主机)上的host.xml <management-interfaces> & ...

  4. Fragment生命周期

  5. DispatcherHelper

    DispatcherHelper 通常,WPF 应用程序从两个线程开始:一个用于处理呈现, 一个用于管理 UI.呈现线程有效地隐藏在后台运行,而 UI 线程则接收输入.处理事件.绘制屏幕 以及运行应用 ...

  6. .net RPC框架选型

    近期开始研究分布式架构,会涉及到一个最核心的组件:RPC(Remote Procedure Call Protocol).这个东西的稳定性与性能,直接决定了分布式架构系统的好坏.RPC技术,我们的产品 ...

  7. JavaScript的一些知识碎片(2)-反射-全局变量-回调

    JavaScript中的反射:编程语言中的反射原理都一样,就是通过操作metadata(描述语言的语言)来完成一些不具备反射功能的语言很难实现的功能.在静态语言中,反射是一个高大上的东西,比如在运行时 ...

  8. Theano3.2-练习之数据集及目标函数介绍

    来自http://deeplearning.net/tutorial/gettingstarted.html#gettingstarted 一.下载 在后续的每个学习算法上,都需要下载对应的文档,如果 ...

  9. 关于开发中 hosts 文件的修改

    这篇文章只是给自己做个笔记吧. 最近的工作经常要改 hosts 文件(C:\Windows\System32\drivers\etc\hosts),并且改完后不立即生效.小胡子哥 提到: 因为服务器设 ...

  10. 【动态域名解析工具】tunnel，国内版的ngrok，花生壳可以睡觉了

    在笔者的系列微信开发教程中,有一个比较基础且重要的一节:微信开发的调试.在文章中我推荐了两种动态域名解析的工具用于将本地的开发环境部署成服务器,一种是花生壳,一种是ngrok,但毕竟我等屌丝用不起或者 ...