jQuery的validate插件的一些使用說明

基本使用

• validate 代碼以下

$(document).ready(function(){
	$("#form1").validate({
		rules: {
			username: { required: true, minlength: 6},
			password: { required: true, minlength: 6}
		},
		messages: {
			username: { required: "必填", minlength: $.validator.format("不得少於{0}字符.")},
			password: { required: "必填", minlength: $.validator.format("不得少於{0}字符.")}
		},
        errorPlacement: function(error, element) {
            element.after(error);
		},
		success: function(label) {
			alert("success");
		},
		submitHandler: function(form) {
			alert("submit");
			form.submit(); //沒有這一句表單不會提交
		}
	});
});

• 上面代碼中的 username 和 password 必須對應 HTML 中驗證字段的 name 屬性，id 是不行的

屬性分析

• rules 和 messages 用於定義字段的驗證規則和提示信息

• success，每一個字段驗證經過後執行的操做，當表單元素驗證成功時執行，對於同一個表單元素，因爲onkeyup、onfocusout、onsubmit等事件都會觸發驗證，因此本方法可能會屢次執行

• submitHandler，當表單驗證成功並提交時執行，存在此方法時表單只能在此方法內部執行form.submit()才能提交，可理解成它替代了表單的onsubmit方法

• errorPlacement，用於將每一個字段的錯誤提示追加到後面

參考

• jQuery Validate