CodePlayer

jQuery Validator的renderError()方法用于处理表单校验不通过时的错误渲染。简而言之，你可以通过重写该方法自定义界面上错误信息的提示方式。

如果你不自定义错误渲染行为，jQuery Validator 默认的renderError()方法将采用jQuery对象实例的tips(message)方法来提示错误信息(message)。如果该方法不存在(如果你没有定义该方法的话)，则使用window.alert(message)来提示错误信息。

jQuery Validator 推荐你使用layer来扩展jQuery对象实例的tips()方法，从而进行常规表单的错误信息提示。例如：

// 为了让提示更美观，扩展jQuery原型对象，添加基于layer支持的tips方法
$.fn.tips = function(msg, delay){
	layer.tips(msg, this, delay || 3000);
};

当然，jQuery Validator也支持自定义renderError()，你可以完全按照自己的方式来进行错误渲染。

语法

jQuery Validator 1.0 新增。jQuery Validator支持通过以下3种方式自定义renderError()。

// 自定义全局(所有实例可用)的renderError()
V.fn.renderError = handler;

// 自定义当前实例(仅该实例可用)的renderError()
v.renderError = handler;

// 自定义当前校验规则(仅该校验规则可用)的renderError()
// 在校验规则对象中指定该属性
renderError: handler

参数

jQuery Validator会为函数handler传入如下参数：

function(message, $target, context){
	// message 用于直接显示的错误提示信息
	
	// $target 当前用于错误渲染的表单元素的jQuery对象
	// 除非校验规则中指定了errorFocus，该表单元素一般就是校验不通过的表单元素
	// 如果不是基于表单输入的校验，$target一般为null
	
	// context 本次校验的上下文对象
	
	// this 指向当前jQuery Validator 实例
}

如果同时存在多种方式的renderError()，则按照如下优先级选取第一个存在的renderError()：

// renderError()的优先级
当前校验规则的 > 当前实例的 > 全局的

示例&说明

以如下HTML表单为例：

<form action="https://codeplayer.vip/">
	<div>
		<label>用户名</label>：
		<input id="username" name="username" type="text" >
	</div>	
	<input type="submit" value="提交" />
</form>

我们可以使用renderError()在校验规则中自定义错误渲染行为：运行代码

// 在表单提交时执行校验
$("form").v("submit", {
	"#username": {
		extend: "username", // 继承内置的"username"规则
		renderError: function(message, $target, context){
			alert("这是自定义的错误提示方式：" + message);			
		}
	}
});