`
tooby
  • 浏览: 117366 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

jQuery.validate 用法

 
阅读更多
//覆盖默认的提示信息(默认为英文)
jQuery.extend(jQuery.validator.messages, {
        required: "必填字段",
  remote: "请修正该字段",
  email: "请输入正确格式的电子邮件",
  url: "请输入合法的网址",
  date: "请输入合法的日期",
  dateISO: "请输入合法的日期 (ISO).",
  number: "请输入合法的数字",
  digits: "只能输入整数",
  creditcard: "请输入合法的信用卡号",
  equalTo: "请再次输入相同的值",
  accept: "请输入拥有合法后缀名的字符串",
  maxlength: jQuery.validator.format("请输入一个 长度最多是 {0} 的字符串"),
  minlength: jQuery.validator.format("请输入一个 长度最少是 {0} 的字符串"),
  rangelength: jQuery.validator.format("请输入 一个长度介于 {0} 和 {1} 之间的字符串"),
  range: jQuery.validator.format("请输入一个介于 {0} 和 {1} 之间的值"),
  max: jQuery.validator.format("请输入一个最大为{0} 的值"),
  min: jQuery.validator.format("请输入一个最小为{0} 的值")
});


//自定义校验规则
jQuery.validator.addMethod("isOther", function(value, element){
    var item = $(element);
    var value = item.val();
    if (value.match(/.*_OTHER$/g) && !$(".relationMark_" + item.attr("class")).val()) {
        alert('请填写对应的其他信息!');
        $(".relationMark_" + item.attr("class")).focus();
        return true;
    }

    return value;
}, '请填写对应的其他信息!');


//定义表单中对应name的校验规则
var validate_rules ={  
        "sysAMForm.tecVerify.sysName":{  
            required: true
        },
        "sysAMForm.tecVerify.operSys":{
            required: true,
            isOther: true
        },
        "sysAMForm.tecVerify.ssoMethod":{
            required: true
        }
  };  


//Form 校验配置绑定
Form_Validator = $("#submitTecVerifyForm").validate({  
          rules: validate_rules,  
          debug: true,  
          wrapper: "div",  
          errorPlacement: function(label, element) {  
              label.addClass('errorClass');  
              label.insertAfter(element);  
          }  
}); 


//手动执行校验
if (!$("#submitTecVerifyForm").valid()) {
      var invalidElements = Form_Validator.invalidElements(); // contain the invalid elements 
      Form_Validator.showErrors();//显示所有错误信息
      $(invalidElements[0]).focus();//定位到有问题的地方
      return false;
}

 

分享到:
评论

相关推荐

    jquery.validate.js表单验证.pdf

    1. jquery.validate.js的引入:文件提到了引入jquery.validate.js的方法,需要先引入jquery.js,然后引入jquery.validate.js。这是因为jquery.validate.js依赖于jquery.js。 2. 验证规则:文件列出了jquery....

    jQuery.validate.js

    接着,为需要验证的表单添加`id`属性,并使用jQuery的`.validate()`方法进行初始化: ```javascript $(document).ready(function() { $('#myForm').validate({ rules: { // 验证规则定义 }, messages: { // ...

    jQuery.validate验证

    5. **使用方法**: 要使用jQuery.validate,你需要为表单添加一个id,并在脚本中进行初始化,如: ```javascript $("#yourFormId").validate({ rules: { fieldName: { required: true, email: true }, //...

    jquery.validate.js 和 帮助文档.rar

    本文将深入探讨jQuery validate.js的核心功能及其API,同时结合提供的帮助文档,为你揭示其背后的实现原理和使用技巧。 首先,jQuery validate.js的主要功能是为HTML表单提供强大的验证规则。通过简单的配置,...

    jQuery.validate.js表单验证及API

    本文将深入探讨jQuery.validate.js的核心功能、API使用方法以及一些常见的使用场景。 首先,jQuery.validate.js是由Jörn Zaefferer创建的一个轻量级插件,它是jQuery Form Plugin的一部分,主要用于简化HTML表单的...

    jQuery.validate.js+API中文

    除了基本的验证规则,jQuery Validate还支持自定义验证方法。例如,你可以创建一个检查密码强度的方法: ```javascript jQuery.validator.addMethod("passwordStrength", function(value, element) { // 这里实现...

    js jquery-1.11.1.min.js jquery.validate.min.js

    - **表单验证**:jQuery Validate 提供了`.validate()`方法,用于初始化验证插件,如`$("#myForm").validate()`;通过设置规则`rules`和错误消息`messages`,可以实现自定义验证。 - **验证规则**:例如,`rules: {...

    jquery.metadata.js和jquery.validate.js

    `jquery.validate.js`可以和`jquery.metadata.js`配合使用,自动应用元数据中的验证规则和配置。 使用`jquery.validate.js`的基本步骤如下: 1. 引入jQuery库、`jquery.metadata.js`和`jquery.validate.js`的脚本...

    jquery.validate 使用

    本文将深入探讨jQuery Validate的使用方法,以及如何结合实际项目进行应用。 一、jQuery Validate插件简介 jQuery Validate是一款由Jörn Zaefferer开发的jQuery插件,主要用于表单验证。它提供了丰富的验证规则和...

    jquery表单验证框架:jquery.validate.zip

    jQuery是一个广泛使用的JavaScript库,而jQuery.validate则是jQuery的一个强大插件,专门用于实现客户端的表单验证。本篇文章将详细介绍jQuery.validate框架及其核心功能。 一、jQuery.validate简介 jQuery....

    jquery.validate Validation .js验证框架 帮助 手册 文档 chm

    jquery.validate Validation .js验证框架 帮助 手册 文档.chm 版本 方面查询 (一)、可选项( options ) 1 (二)插件方法 (jQuery validation) 6 (三、四)选择器及实用工具 (jQuery validation) 7 四、实用工具...

    jquery.validate.js校验页面的js与使用方法

    引入页面的时候,引入: ... ${request.contextPath}/js/common/plug/jquery/jquery.validate.min.js"> ${request.contextPath}/js/common/plug/jquery/jquery.validate.expand.js"> 把标题正确引入即可使用

    jquery.validate表单验证密码完整例子(带密码强度显示)

    2. **初始化验证**:使用`jQuery`选择器找到需要验证的表单元素,并调用`.validate()`方法,配置相应的验证规则。例如,对于密码字段,可能有`required`(必填)、`minlength`(最小长度)和自定义的正则表达式规则...

    jQuery验证控件jquery.validate.js使用说明+中文API

    jQuery 验证控件 jquery.validate.js 使用说明 + 中文 API jQuery 验证控件 jquery.validate.js 是一个功能强大且广泛使用的 JavaScript 验证插件,旨在帮助开发者快速实现表单验证功能。下面是 jquery.validate....

    jquery.validate1.7验证插件最新版

    在项目中使用jQuery Validate,首先需要确保已引入jQuery库,然后引入validate插件的JS文件。例如: ```html <script src="https://code.jquery.com/jquery-1.x.min.js"></script> <script src="jquery.validate....

    最新jQuery.validate.js+帮助文档:jQuery.validate.js+jquery.metadata.js+messages_cn.js

    jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求。该插件捆绑了一套有用的验证方法,包括 URL 和电子邮件验证,同时提供了一个用来...

    jQuery.validate实例

    首先,我们需要了解jQuery.validate的基本用法。在项目中引入jQuery库和validate插件后,可以通过以下方式初始化验证: ```javascript $("#myForm").validate({ rules: { // 验证规则 }, messages: { // 错误...

    jquery.validate.js用法.doc

    ### jQuery.validate.js 插件详解及使用方法 #### 一、引言 `jQuery.validate.js` 是基于 jQuery 的一个非常强大的表单验证插件。它不仅提供了多种预定义的验证规则,还支持自定义规则,并且可以轻松地与 HTML 表单...

Global site tag (gtag.js) - Google Analytics