jquery实现表单验证

先写好验证效果的css样式

/*验证表单样式*/
span.error{
	margin-left:5px;
	padding-left:25px;
	color:#F00;
	background:url(error.gif) left center no-repeat;
}
span.success{
	margin-left:5px;
	padding-left:25px;
	color:#999;
	background:url(success.gif) left center no-repeat;
}

导入css样式、jquery文件及validate插件

    <link href="Images/style.css" rel="stylesheet" type="text/css" />
    <script src="JS/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script src="JS/jquery.validate.min.js" type="text/javascript"></script>

在head里写入jquery验证

    <script type="text/javascript">
        $(document).ready(function () {
            //表单验证JS
            $("#form1").validate({
                //出错时添加的标签
                errorElement: "span",
                success: function (label) {
                    //正确时的样式
                    label.HTML("&nbsp").addClass("success");//这里如果用text无效，不知道为什么                }
            });
        });
    </script>

要验证的文本必须指定样式

<input id="IsExiststxt" type="text" runat="server" class="required" />

以下是jquery验证的样式

jQuery.extend(jQuery.validator.messages, {
        required: "必填字段",
		remote: "请修正该字段",
		email: "电子邮件格式有误",
		url: "请输入合法的网址",
		date: "请输入合法的日期",
		dateISO: "请输入合法的日期 (ISO).",
		number: "请输入合法的数字",
		digits: "只能输入整数",
		creditcard: "请输入合法的信用卡号",
		equalTo: "请再次输入相同的值",
		accept: "请输入拥有合法后缀名的字符串",
		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} 的值")
});