JQ validation使用

最新推荐文章于 2025-05-07 18:43:26 发布

原创最新推荐文章于 2025-05-07 18:43:26 发布 · 377 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#xhtml #javascript #ViewUI

本文介绍如何在网页中配置JQuery Validation插件，包括引入依赖文件、定义错误信息、绑定表单验证及设置错误样式等步骤。适用于解决表单验证问题。

<script src="resources/js/jquery.min.js" type="text/javascript"
	language="javascript"></script>
<script src="resources/js/jquery.metadata.js" type="text/javascript"
	language="javascript"></script>
<script src="resources/js/jquery.validate.min.js" type="text/javascript"
	language="javascript"></script>

<script type="text/javascript">
	jQuery.extend(jQuery.validator.messages, {
		required : "该字段为必填项",
		email : "邮箱格式不正确",
		url : "请输入正确的网址",
		date : "请输入正确的日期",
		number : "请输入正确的数字",
		digits : "请输入正确的整数",
		equalTo : "请再次输入相同的值",
		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} 的值")
	});
	$(function() {
		$("form").validate();
	});
</script>
<style type="text/css">
label.error {
	color: red;
	margin-left: 20px;
}
</style>

第一段用来引入jq validation，顺序最好不要改变，

第二段用来定义错误信息，

第三段用来绑定表单。

第四段用来定义错误信息样式。

在JSP中如果存在兼容问题，将doctype改成如下值：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

JQ依赖库最好为JQ validation官方的库