接上一篇

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. swift 集合类型（二）

    说到swift的集合类型,就不得不谈到Dictionary.包含一个键值对组合的集合. var air = ["name":"warner","tit ...

  2. DocOptimizer 0.9.0 Beta Released

    DocOptimizer 是一个文档优化工具,它通过移除Excel中多余的单元格:将嵌入的OLE替换成图片:移除文档中的隐藏信息:优化文档中的图片等等手段,将Office或PDF文件压缩20%-90% ...

  3. 执行sudo时报错：effective uid is not 0

    http://jingyan.baidu.com/article/c45ad29cd83d4b051753e232.html     今天将 / 授权给了一个普通用户 导致一些问题. 启事: 操作前一 ...

  4. MVC-RedirectToAction跳转到其他Area

    mvc使用Area分区开发后,存在不同Area之间的跳转,需要为每个区间添加Area规则,如下: using System.Web.Mvc; namespace web.Areas.FrameSet ...

  5. iframe在ios下无故扩大的问题探究

    移动端页面内嵌了个 iframe,在 ios 下打开却发现页面怪异.比如 demo.代码如下: <!DOCTYPE html> <html lang="zh-CN" ...

  6. 一起写一个JSON解析器

    [本篇博文会介绍JSON解析的原理与实现,并一步一步写出来一个简单但实用的JSON解析器,项目地址:SimpleJSON.希望通过这篇博文,能让我们以后与JSON打交道时更加得心应手.由于个人水平有限 ...

  7. 仿造slither.io第一步：先画条蛇

    前言 最近 slither.io 貌似特别火,中午的时候,同事们都在玩,包括我自己也是玩的不亦乐乎. 好久好久没折腾过canvas相关的我也是觉得是时候再折腾一番啦,所以就试着仿造一下吧.楼主也没写过 ...

  8. python列表下标用法

    python中的列表下标实在太灵活了,要根据表象来分析它的内在机理,这样用起来才能溜.下标可以为负数有利有弊,好处是使用起来更简便,坏处是当我下表越界了我也不知道反倒发生奇奇怪怪的错误. print ...

  9. SpringMVC学习--入门程序

    前面基本介绍了下SpringMVC的运行原理,现在按照前面的原理一步步实现一个简单的程序.先搭建一个简单的web工程,将spring的jar包导入项目中. 前端控制器配置 在web.xml中配置如下: ...

  10. oracle主键自增

    oracle主键自增 1建立数据表 create table Test_Increase(            userid number(10) primary key,  /*主键,自动增加*/ ...