当前位置: 首页 > 中文手册 > jQuery Validator pre 输入预处理器

jQuery Validator pre 输入预处理器

jQuery Validator的输入预处理器(pre)用于在执行校验前,对输入内容进行对应的预处理。

在jQuery Validator中,除非特别声明,所有的校验器都不会对原始输入进行额外的去空格、大小写转换等处理,而是直接对原始输入进行校验。例如:非空校验器(required)只会将空字符串""视为空,而不会将包含空格的字符串" "视为空。

不过,在表单校验时,我们又确实存在将空格字符串等同于空字符串来校验的需要。此时,我们可以使用输入预处理器来对输入内容进行相应的预处理,然后对处理后的内容进行校验。

语法

jQuery Validator 1.0 新增

// 在校验规则对象中指定该属性
pre: expression

// 例如:去除两侧空白字符、转小写
pre: "trim,lower"

参数

参数描述
expressionString类型将一到多个预处理器名称之间以英文逗号","隔开的表达式字符串。

expression中的预处理器名称即是对应的输入预处理器的函数名称。jQuery Validator将按照表达式中指定的预处理器顺序,依次对输入进行预处理。下一个预处理器将会在上一个预处理器处理结果的基础上,继续进行处理。之后,将最终的处理结果作为输入,交由校验器进行校验。

内置预处理器

目前jQuery Validator内置了以下输入预处理器:

  • trim:去除输入两侧的空白字符。

  • trimAll:去除输入中的所有(包括中间的)空白字符。

  • lower:将输入全部转为小写格式。

  • upper:将输入全部转为大写格式。

  • flush:该预处理器不会对输入进行任何处理,它只是将上一个预处理器的处理结果,同步更新到该表单元素中,以便于用处理后的输入值进行表单提交或其他操作。如果当前输入不是来自表单元素,则该预处理器直接返回之前的处理结果,不会进行更新操作。

自定义预处理器

如果内置的预处理器无法满足你的要求,你还可以自定义预处理器。

在jQuery Validator中,所有的预处理器函数均存储于V.fn.pre对象中。因此,你可以如下定义一个新的预处理器,来实现将输入的首字符转为大写:

// 将输入字符串的首字符转为大写
V.fn.pre.ucfirst = function(value, context){
	// value 经过之前的预处理器处理后的表单输入值
	// context 本次校验的上下文对象
	if(value.length > 0){
		return value.charAt(0).toUpperCase() + value.substr(1);
	}
	return value;
};

接着,我们就可以在定义校验规则时,通过函数名称来指定该预处理器进行输入预处理:

$("form").v("submit", {
	"#input": {
		pre: "trim,ucfirst,flush" // 去除输入值两侧的空格,将首字符转为大写,并更新到表单元素中
		// 其他校验定义		
	}
});

注意事项:
1、出于严格规范性和性能考虑,expression中暂时不能包含任何空白字符。
例如"trim, lower"是无效的。
2、自定义的预处理器函数必须返回处理后的值,jQuery Validator会将该返回结果用于后续的预处理和校验工作。

示例&说明

以如下HTML表单为例:

<form action="http://www.365mini.com/">
	<div>
		<label>用户名</label>:
		<input id="username" name="username" type="text" >
	</div>
	<div>
		<label>身份证号码</label>:
		<input id="idcard" name="idcard" type="text" >
	</div>
	<input type="submit" value="提交" />
</form>

我们可以使用pre输入预处理器来去除"用户名"输入中的所有空白字符、全部转为小写;由于身份证号码可能包含"X",为了避免用户输入小写"x",因此我们可以先将其全部转为大写:运行代码

// 在表单提交时执行校验
$("form").v("submit", {
	"#username": {
		pre: "trimAll,lower,flush",
		// 预处理器lower已将输入转为小写,因此text校验器无需考虑字母的大小写问题
		text: /^[a-z][a-z0-9_]{5,15}$/,
		message: {
			text: "{label}必须是英文字母、数字和下划线组成的6~16位字符,并且必须以字母开头!"
		}
	},
	"#idcard": {
		pre:"upper,flush",
		format: "idcard/18:[18,]"
	}
});
6 0
我们认为: 用户的主要目的,是为了获取有用的信息,而不是来点击广告的。因此本站将竭力做好内容,并将广告和内容进行分离,确保所有广告不会影响到用户的正常阅读体验。用户仅凭个人意愿和兴趣爱好点击广告。
我们坚信:只有给用户带来价值,用户才会给我们以回报。
CodePlayer技术交流群1CodePlayer技术交流群1

帮朋友打一个硬广告:

P2P网贷系统(Java版本) 新年低价大促销,多年P2P技术积累,系统功能完善(可按需定制,可支持第三方存管、银行存管),架构稳定灵活、性能优异、二次开发快速简单。 另可提供二次开发、安装部署、售后维护、安全培训等一条龙服务。

外行看热闹,内行看门道。可以自信地认为,在系统设计上,比市面上的晓风、迪蒙、方维、绿麻雀、国融信、金和盛等P2P系统要好。
深圳地区支持自带技术人员现场考察源代码、了解主要技术架构,货比三家,再决定是否购买。

也可推荐他人购买,一旦完全成交,推荐人可获得实际售价 10% 的返现。
有意向者,详情请 点击这里 联系,工作时间立即回复。