jQuery的validation插件

0 0

jQuery的validation插件5

$(document).ready(function() {
	// validate signup form on keyup and submit
	var validator = $("#signupform").validate({
		rules: {
			firstname:{
				required: true,
				digits: true
			},
			lastname: "required",
			username: {
				required: true,
				minlength: 2,
				remote: "users.php"
			},
			password: {
				required: true,
				minlength: 5
			},
			password_confirm: {
				required: true,
				minlength: 5,
				equalTo: "#password"
			},
			email: {
				required: true,
				email: true,
				remote: "emails.php"
			},
			dateformat: "required",
			terms: "required"
		},
		messages: {
			firstname: {
				required:"Enter your firstname",
				digits:"Enter a number"
			},
			lastname: "Enter your lastname",
			username: {
				required: "Enter a username",
				minlength: jQuery.format("Enter at least {0} characters"),
				remote: jQuery.format("{0} is already in use")
			},
			password: {
				required: "Provide a password",
				rangelength: jQuery.format("Enter at least {0} characters")
			},
			password_confirm: {
				required: "Repeat your password",
				minlength: jQuery.format("Enter at least {0} characters"),
				equalTo: "Enter the same password as above"
			},
			email: {
				required: "Please enter a valid email address",
				minlength: "Please enter a valid email address",
				remote: jQuery.format("{0} is already in use")
			},
			dateformat: "Choose your preferred dateformat",
			terms: "Choose this checkbox "
		},
		// the errorPlacement has to take the table layout into account
		errorPlacement: function(error, element) {
			if ( element.is(":radio") )
				error.appendTo( element.parent().next().next() );
			else if ( element.is(":checkbox") )
				error.appendTo ( element.next() );
			else
				error.appendTo( element.parent().next() );
		},
		// specifying a submitHandler prevents the default submit, good for the demo
		submitHandler: function() {
			alert("submitted!");
		},
		// set this class to error-labels to indicate valid fields
		success: function(label) {
			// set &nbsp; as text for IE
			label.html("&nbsp;").addClass("checked");
		}
	});
	
	// propose username by combining first- and lastname
	$("#username").focus(function() {
		var firstname = $("#firstname").val();
		var lastname = $("#lastname").val();
		if(firstname && lastname && !this.value) {
			this.value = firstname + "." + lastname;
		}
	});
 
});

两个问题：
1.后边的success: function(label)这里的label参数传进的是什么，是哪来的？
2.如果自定义正则表达式来匹配，怎么写？

代码地址：http://jquery.bassistance.de/validate/demo/milk/

问题补充：
谢谢jones：按你的提示看了下源码，errorPlacement: function(error, element)这里的error参数传进来的就是一个label。

还有第2个问题是是否可以用自定义的正则表达式？难道要改源码在源码里定义？

再附带个小疑问：）这里：

           
            // set &nbsp; as text for IE  
            label.html("&nbsp;").addClass("checked");

这里为IE在label里放一个空格什么讲究呢？

jQuery

2008年11月09日 20:33

davis129
28
0 0 0

2个答案按时间排序按投票排序

0 0

采纳的答案

引用

还有第2个问题是是否可以用自定义的正则表达式？难道要改源码在源码里定义？

这个当然不用修改源代码，插件本身提供的API可以添加新的验证方法，看这个：
http://docs.jquery.com/Plugins/Validation/Validator/addMethod#namemethodmessage

引用

这里为IE在label里放一个空格什么讲究呢？

因为在IE中如果<td></td>这样的html显示和FF等其它浏览器中<td></td>显示的宽度不一样的，IE中如果你的<td></td>中啥都没有显示的时候就会忽略table中指定的td宽度，随便添加一个东西，<td></td>的宽度才能继承过来，如果你不是在td中显示错误信息，那么这个

.html("&nbsp;")

就没必要了，只适用于td

2008年11月11日 09:07

jones
1626
0 0 0

添加评论

0 0

引用

1.后边的success: function(label)这里的label参数传进的是什么，是哪来的？

这个label表示的是显示信息的元素，关联的是你的errorPlacement：看标红的地方：

引用

         errorPlacement: function(error, element) {
             if ( element.is(":radio") )
                 error.appendTo( element.parent().next().next() );
             else if ( element.is(":checkbox") )
                 error.appendTo ( element.next() );
             else
                 error.appendTo( element.parent().next() );
         },

2008年11月10日 09:24

jones
1626
0 0 0