`

jquery validate 比较全的备注

    博客分类:
  • JS
 
阅读更多

jquery.validate remote 和 自定义验证方法

$(function(){

var validator = $("#enterRegForm").validate({
debug:false, //调试模式取消submit的默认提交功能
//errorClass: "error",//默认为错误的样式类为:error
//validClass: "check",//验证成功后的样式,默认字符串valid
focusInvalid: true,//表单提交时,焦点会指向第一个没有通过验证的域
//focusCleanup:true;//焦点指向错误域时,隐藏错误信息,不可与focusInvalid一起使用!
onkeyup: true,
errorElement: "div",
submitHandler: function(form){ //表单提交句柄,为一回调函数,带一个参数:form
form.submit(); //提交表单
},

rules: {
"enterprise.enName": {
required: true,
minlength: 6,
remote:{
url: "/nameServlet",     //后台处理程序 
type: "get",               //数据发送方式
dataType: "json",           //接受数据格式   
data: {                     //要传递的数据
enName: function() {
return $("#enName").val();
}
}

}
},

"user.passWord":{
required:true,
rangelength:[6,18]
},
passWordConf:{
required:true,
rangelength:[6,18],
equalTo:"#passWord" //此处的passWord 是<input id="passWord"> 一开始还以为是name的值呢,气死了
}

},

messages: { //自定义验证消息
"enterprise.enName": {
required: "请填写企业名称!",
minlength: $.format("至少要{0}个字符!"),
remote:$.format("该企业名称已存在!")

},
"user.passWord":{
required:"请填写确认密码!",
rangelength:$.format("密码要在{0}-{1}个字符之间!")
},
passWordConf:{
required:"请填写确认密码!",
rangelength:$.format("确认密码要在{0}-{1}个字符之间!"),
equalTo:"确认密码要和密码一致!"
},

errorPlacement: function(error, element) { //验证消息放置的地方
//error.appendTo( element.parent("td").next("td").children(".msg") );
error.appendTo( element.parent(".field").next("div"));
},
highlight: function(element, errorClass) { //针对验证的表单设置高亮
$(element).addClass(errorClass);
},
success: function(div) {
div.addClass("valid");
}
});

});

自定义方法;

新建一个js文件:$(document).ready(function(){
// 字符最小长度验证(一个中文字符长度为2)
jQuery.validator.addMethod("stringMinLength", function(value, element, param) {
var length = value.length;
for ( var i = 0; i < value.length; i++) {
if (value.charCodeAt(i) > 127) {
length++;
}
}
return this.optional(element) || (length >= param);
}, $.validator.format("长度不能小于{0}!"));

// 字符最大长度验证(一个中文字符长度为2)
jQuery.validator.addMethod("stringMaxLength", function(value, element, param) {
var length = value.length;
for ( var i = 0; i < value.length; i++) {
if (value.charCodeAt(i) > 127) {
length++;
}
}
return this.optional(element) || (length <= param);
}, $.validator.format("长度不能大于{0}!"));

 // 字符验证      
jQuery.validator.addMethod("stringCheck", function(value, element) {      
return this.optional(element) || /^[\u0391-\uFFE5\w]+$/.test(value);      
}, "只能包括中文字、英文字母、数字和下划线");  

// 中文字两个字节      
jQuery.validator.addMethod("byteRangeLength", function(value, element, param) {      
var length = value.length;      
for(var i = 0; i < value.length; i++){      
if(value.charCodeAt(i) > 127){      
length++;      
}      
}      
return this.optional(element) || ( length >= param[0] && length <= param[1] );      
}, "请确保输入的值在3-15个字节之间(一个中文字算2个字节)");  

// 字符验证
jQuery.validator.addMethod("string", function(value, element) {
return this.optional(element) || /^[\u0391-\uFFE5\w]+$/.test(value);
}, "不允许包含特殊符号!");
// 必须以特定字符串开头验证
jQuery.validator.addMethod("begin", function(value, element, param) {
var begin = new RegExp("^" + param);
return this.optional(element) || (begin.test(value));
}, $.validator.format("必须以 {0} 开头!"));
// 验证两次输入值是否不相同
jQuery.validator.addMethod("notEqualTo", function(value, element, param) {
return value != $(param).val();
}, $.validator.format("两次输入不能相同!"));
// 验证值不允许与特定值等于
jQuery.validator.addMethod("notEqual", function(value, element, param) {
return value != param;
}, $.validator.format("输入值不允许为{0}!"));

// 验证值必须大于特定值(不能等于)
jQuery.validator.addMethod("gt", function(value, element, param) {
return value > param;
}, $.validator.format("输入值必须大于{0}!"));

// 验证值小数位数不能超过两位
jQuery.validator.addMethod("decimal", function(value, element) {
var decimal = /^-?\d+(\.\d{1,2})?$/;
return this.optional(element) || (decimal.test(value));
}, $.validator.format("小数位数不能超过两位!"));
//字母数字
jQuery.validator.addMethod("alnum", function(value, element) {
return this.optional(element) || /^[a-zA-Z0-9]+$/.test(value);
}, "只能包括英文字母和数字");
// 汉字
jQuery.validator.addMethod("chcharacter", function(value, element) {
var tel = /^[\u4e00-\u9fa5]+$/;
return this.optional(element) || (tel.test(value));
}, "请输入汉字");
// 身份证号码验证      
jQuery.validator.addMethod("isIdCardNo", function(value, element) {
return this.optional(element) || /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$/.test(value)||/^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[A-Z])$/.test(value);      
}, "请正确输入您的身份证号码");

// 手机号码验证      
jQuery.validator.addMethod("isMobile", function(value, element) {      
var length = value.length;  
var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;  
return this.optional(element) || (length == 11 && mobile.test(value));      
}, "请正确填写您的手机号码");      

// 电话号码验证      
jQuery.validator.addMethod("isTel", function(value, element) {      
var tel = /^\d{3,4}-?\d{7,9}$/;    //电话号码格式010-12345678  
return this.optional(element) || (tel.test(value));      
}, "请正确填写您的电话号码");  

// 联系电话(手机/电话皆可)验证  
jQuery.validator.addMethod("isPhone", function(value,element) {  
var length = value.length;  
var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;  
var tel = /^\d{3,4}-?\d{7,9}$/;  
return this.optional(element) || (tel.test(value) || mobile.test(value));  

}, "请正确填写您的联系电话");  

// 邮政编码验证      
jQuery.validator.addMethod("isZipCode", function(value, element) {      
var tel = /^[0-9]{6}$/;      
return this.optional(element) || (tel.test(value));      
}, "请正确填写您的邮政编码");   

});

该文件要先被引用再对form进行验证。

注意:remote 中的url 为servlet,但是这个servlet该怎么写呢

一开始以为是跟平时的一样:out.println("用户名"+name+"已存在!");

虽然可以验证,但是还是存在问题:输入个不存在的name还是提示存在。

后来还是Google,看到别人也是犯了这样的错误,解决方法时返回true,false.

但是 doGet 是void类型的,return true 是行不通的。

后来又请教群里的高手,正确写法是out.println("true");就可以了。

哎,费了老长时间

总算是把问题给解决了。

分享到:
评论

相关推荐

    jquery validate 信息气泡提示

    在网页开发中,jQuery Validate 是一个非常常用的验证插件,用于对用户输入的数据进行校验,确保数据的有效性和完整性。这个插件可以帮助开发者创建复杂的表单验证规则,提高用户体验,减少服务器端的压力。结合 ...

    jquery validate例子

    《jQuery Validate插件详解与实例应用》 在Web开发中,表单验证是不可或缺的一环,它能够确保用户输入的数据符合预设的规则,提高数据的准确性和安全性。jQuery Validate是一个强大的JavaScript库,专为jQuery设计...

    jQuery Validate 1.1.2

    jQuery Validate 是一个强大的JavaScript库,专门用于前端表单验证,由jQuery团队开发并维护。它极大地简化了在网页上创建高效、用户友好的验证规则的过程,避免了开发者编写大量重复的验证代码。jQuery Validate ...

    jquery validate 表单验证

    首先,`jquery.js`是jQuery的核心库,它是jQuery Validate的基础,没有它,我们无法使用jQuery Validate。确保引入了最新的jQuery版本,以便利用其强大的DOM操作和事件处理能力。 其次,`myvalidate.js`可能是你...

    jquery validate依赖包及其帮助文档.rar

    《jQuery Validate插件详解与应用指南》 在Web开发领域,表单验证是不可或缺的一环,它能够确保用户输入的数据符合预设的规则,从而提高数据的准确性和系统的稳定性。jQuery Validate是一个强大的JavaScript库,专...

    jquery validate 验证手册

    《jQuery Validate验证手册》是针对JavaScript库jQuery的一个插件,主要功能是提供强大的表单验证功能,帮助开发者创建用户友好的、功能丰富的交互式表单。这个插件基于jQuery库,利用JavaScript的强大功能,简化了...

    jQueryValidate.rar

    《jQuery Validate插件详解及其应用》 在Web开发中,表单验证是不可或缺的一部分,它确保用户输入的数据符合预设的规则,提高了用户体验并减少了服务器端的负担。jQuery Validate插件是实现这一功能的强大工具,它...

    jquery validate 验证自定义样式

    在本文中,我们将深入探讨如何利用jQuery Validate来创建自定义验证样式。 首先,我们从标题"jquery validate 验证自定义样式"开始。jQuery Validate插件默认提供了一些基本的样式,但这些样式可能不能满足所有设计...

    jquery.validate 版本大全

    jquery.validate.1.9.0.min.js jquery.validate.1.12.0.min.js jquery.validate.1.13.1.min.js jquery.validate.1.16.0.min.js jquery.validate.1.14.0.min.js jquery.validate.1.15.1.min.js jquery.validate....

    解决jquery validate remote 为什么只验证一次

    解决jquery validate remote 只验证一次的问题

    jquery validate 使用详解

    ### jQuery Validate 插件使用详解 #### 一、概述 jQuery Validate 是一款强大的表单验证插件,基于 jQuery 框架开发而成。它能够帮助开发者轻松实现客户端表单验证功能,大大提高了用户体验并减少了服务器端的...

    Jquery validate和form插件

    **jQuery validate 和 form 插件详解** 在网页开发中,用户界面的交互性和数据验证是不可或缺的部分。jQuery 是一个广泛使用的 JavaScript 库,它简化了 DOM 操作、事件处理和动画效果。`jQuery validate` 和 `...

    jQuery Validate插件验证表单小练

    jQuery Validate 插件是Web开发中广泛使用的工具,主要用于实现前端表单验证,它极大地简化了用户输入数据的检查过程,提供了丰富的验证规则和自定义方法。在这个“jQuery Validate插件验证表单小练”中,我们将深入...

    jquery validate的漂亮css样式验证

    `jQuery Validate`是一个非常流行的JavaScript库,用于在前端进行表单验证。这个库极大地简化了对用户输入数据的检查,确保它们符合特定的规则和格式。`jQuery Validate`结合自定义CSS样式,可以让表单验证既实用又...

    jQuery validate 自定义样式、规则

    jQuery Validate 是一个非常流行的JavaScript库,用于在网页表单中进行验证。这个库极大地简化了对用户输入数据的检查,确保在提交之前满足特定的业务规则。在本篇博文中,我们将深入探讨如何自定义jQuery Validate...

    jquery validate默认错误提示显示位置修改

    ### 修改jQuery Validate默认错误提示显示位置 在网页开发过程中,表单验证是非常重要的一个环节,它不仅能够提高用户体验,还能确保数据的有效性和安全性。jQuery Validate插件是实现表单验证功能的一个强大工具,...

    Jquery Validate修改版

    《jQuery Validate修改版:提升表单验证体验》 在网页开发中,用户输入的验证是不可或缺的一环,它能够确保用户提交的数据符合预期,避免无效数据的产生,从而提高用户体验和服务器端处理效率。jQuery Validate插件...

    jquery validate配合struts2简单整改

    《jQuery Validate与Struts2整合应用详解》 在Web开发中,前端验证用户输入的数据是必不可少的一环,jQuery Validate插件就是一款强大的JavaScript验证工具,它可以帮助我们方便地实现表单验证。与此同时,Struts2...

    jquery validate 最稳定版本

    jQuery Validate 插件的基本用法是首先在页面中引入jQuery库和validate插件的JavaScript文件。然后,为要验证的表单添加一个`id`属性,并在JavaScript代码中调用`.validate()`方法来初始化验证规则。例如: ```...

    jquery validate中文教程

    在Web开发中,确保用户输入的数据符合预期格式和要求至关重要,而jQuery Validate则提供了简单易用的API来实现这一功能。 在开始使用jQuery Validate之前,你需要在HTML页面中引入jQuery库和jQuery Validate插件的...

Global site tag (gtag.js) - Google Analytics