接上一篇

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. handlebars+require

    handlebars+require 最近在某网站看到了handlebars.js,出于好奇就百度了下这是神马玩意,结果让我很是欢喜,于是就开始自学下,handlebars就几个方法,蛮简单,言归正传 ...

  2. opencv 中对一个像素的rgb值或像素值进行操作的几个常用小办法【转】

    You can access the Image pixels in many ways:1. One using the Inbuilt macro2. One using the pointer ...

  3. Linux文件结构及基本文件夹

    虽然Linux系统有很多种类,但是对于文件系统分区这块,基本上各个版本的Linux系统都是一样的.Linux文件系统分区不像Windows那样将硬盘分为C.D.E.F盘这样,Linux的文件结构是单个 ...

  4. Jump Game 的三种思路 - leetcode 55. Jump Game

    Jump Game 是一道有意思的题目.题意很简单,给你一个数组,数组的每个元素表示你能前进的最大步数,最开始时你在第一个元素所在的位置,之后你可以前进,问能不能到达最后一个元素位置. 比如: A = ...

  5. sdk墙内更新方法

    因为GFW有“保护”,我们能“安全”的遨游在中华互联局域网内.如何快速地更新sdk,一直是Android开发者的心病.网上流传着五花八门的方法,在这我记录一些我用过的切实可行的方法供给有需要的人.同时 ...

  6. 系统升级日记（1）- 升级到SQL Server 2012

    最近一段时间在公司忙于将各类系统进行升级,其最主要的目标有两个,一个是将TFS2010升级到TFS2013,另外一个是将SharePoint 2010升级到SharePoint 2013.本记录旨在记 ...

  7. SQLite剖析之体系结构

    1.通过官方的SQLite架构文档,理清大体的系统层次:Architecture of SQLite 2.阅读SQLite Documentation中Technical/Design Documen ...

  8. JavaScript instanceof 运算符深入剖析

    简介: 随着 web 的发展,越来越多的产品功能都放在前端进行实现,增强用户体验.而前端开发的主要语言则是 JavaScript.学好 JavaScript 对开发前端应用已经越来越重要.在开发复杂产 ...

  9. mysql创建触发器

    触发器语句只有一句话 可以省略begin和end CREATE trigger `do_praise` after insert on praise for each row update post ...

  10. java泛型中的对象

    import java.util.HashMap; class Key { String s; Key(String s) { this.s = new String(s); } @Override ...