CodePlayer

<form action="https://codeplayer.vip/">
	<div>
		<label>用户名</label>：
		<input id="username" name="username" type="text" />
	</div>
	<div>
		<label>密码</label>：
		<input id="password" name="password" type="password" />
	</div>			
	<div>
		<label>年龄</label>：
		<input id="age" name="age" type="text" />
	</div>
	<div>
		<label>出生日期</label>：
		<input id="birthday" name="birthday" type="text" />
	</div>
	<div>
		<label>手机号码</label>：
		<input id="cellphone" name="cellphone" type="text" />
	</div>
	<div>
		<label>兴趣爱好</label>：
		<input name="hobby" type="checkbox" value="0" /> 足球 
		<input name="hobby" type="checkbox" value="1" />篮球 
	</div>
	<input type="submit" value="提交" />
</form>

var v = new V();
$("form").v("submit", {
	"#username": "username",
	"#password": "password",
	"#age": "age",
	"#birthday": "date",
	"#cellphone": "cellphone",
	"hobby": "required"
});

v.define("price", {
	required: true, // 非空校验
	format: "number/money", // 两位以内的数字格式校验
	range: "(0,10000]" // 值的范围校验
});

/** ***对单个输入执行校验，使用validate()方法，返回true或false*** */
// 对值直接进行校验，"price"是我们刚才定义的规则名称
var value = "xxx";
v.validate(value, "price");
// 也可以动态指定规则。required=true可以不用指定
// 定义的规则只要不显式指定required=false，默认就是required=true
v.validate(value, {
	format: "number/money",
	range: "(0,10000]"
});
// 也可以传入jQuery对象
v.validate($("#goodsPrice"), "price");


/** ***对多个输入执行校验，使用execute()方法*** */
var rules = {
	"username":"username", // name为"username"的表单指定名为"username"的校验规则
	"password":"password",
	"repassword": { // 规则也可以动态指定
		equalsTo: "password"
	},
	"#goodsPrice":"price" // 也可以"#"开头，表示根据ID获取该元素，否则根据name获取
};
// 立即执行校验，并返回校验结果：true或false
v.execute($("form"), rules); // 等价于 $("form").v(rules);

// 在form表单提交时触发校验，校验失败时自动阻止表单提交
v.execute($("form"), "submit", rules);
// 以上等价于 $("form").v("submit", rules);

// 在form表单提交时，鼠标移开表单元素时，都触发校验
v.execute($("form"), "submit focusout", rules);
// 以上等价于 $("form").v("submit focusout", rules);


/** ***利用表单元素的属性来指定规则名称，使用bindAttr()方法*** */
var options = {
	container: "form", // 元素容器,并对此进行监听
	eventType: "submit", // 监听事件
	attr:"v", // 指定设置规则的属性
	nameAsValue: true, // 如果attr指定的属性值为空,是否可使用name属性值作为其属性值
	cache: true // 是否允许缓存,如果需要校验的元素不再变动,建议开启缓存以提高重复校验的性能
};
v.bindAttr(options); // 一般情况下options可以不用传，默认即为上述设置，当然你也可以指定其中的一个或多个属性以更改对应的属性设置

v.define("price", {
	required:true,
	format: "number/money",
	range: "(0,10000]"
});
// 当输入为空时，对应的提示消息为："{label}不能为空!"
// 当格式不对时，对应的提示消息为："{label}必须是整数或最多保留两位的小数!"
// 当输入不大于0时，对应的提示消息为："{label}必须大于{expected}!"
// 当输入大于10000时，对应的提示消息为："{label}必须小于或等于{expected}!"

// name是表单元素的name属性值
v.labels[name]
// 你可以通过setLabel()方法设置label：v.setLabel("username", "用户名");
// 或批量设置：v.setLabel({"username":"用户名", "password":"密码"});
>
// 你也可以为元素设置label属性：'<input name="name" label="姓名">'
$dom.attr("label")
>
// 取该元素前面的label标签的文本内容作为名称
$dom.prev("label").text()

v.getLabel = function(name, $dom, context){
	if(!name) name = $dom.prop("name");
	// name是表单元素名称，如果之前没有获取过，可能需要你自己获取
	// $doms 是表示当前正在校验的表单元素的jQuery对象
	// context 是上下文对象，请参看文档
}
// 如果需要全局重写，请重写原型上的getLabel方法(将v.getLabel替换为V.fn.getLabel)

// 该规则校验失败，均提示统一的信息
v.define("price", {
	required: true,
	format: "number/money",
	range: "(0,10000]",
	message: "只要校验失败，一律提示该信息"
});
// message还可以为对象，根据不同校验器的失败，分别提示不同的信息
message: {
	required:"{label}必须输入",
	format:"格式不对，提示该信息",
	range:"范围不对，提示该信息"
}
// message 还可以为自定义的函数
message: function(context){
	// 自行返回提示信息，返回值中也支持占位符
}
// message为false，表示不提示任何信息