這兩天在做iframe巢狀的功能，關於iframe頁面中的一些校驗問題，需要用到手動jquery.validate的情況，先在做以記錄，方便日後檢視，程式碼如下：

//載入jquery的校驗方法
$("#inputForm").validate({
	errorContainer: "#messageBox",
	errorPlacement: function(error, element) {
		$("#messageBox").text("輸入有誤，請先更正。");
		if (element.is(":checkbox")||element.is(":radio")||element.parent().is(".input-append")){
			error.appendTo(element.parent().parent());
		} else {
			error.insertAfter(element);
		}
	}
});

//提交時候手動觸發校驗 
function submitFc(){
	//校驗不通過  
	if(!$("#inputForm").valid()){
		return;
	}
	if(confirm("確認要提交？")){ 
		$("#inputForm").submit();
	}
}
 

這樣一來，不論巢狀多少的iframe都可以靈活的去校驗了。

傳統的提交校驗方法如下：

$("#inputForm").validate({
	//校驗通過後執行的方法
	submitHandler: function(form){
		form.submit();
	},
	errorContainer: "#messageBox",
	//校驗失敗後執行的方法
	errorPlacement: function(error, element) {
		$("#messageBox").text("輸入有誤，請先更正。");
		if (element.is(":checkbox")||element.is(":radio")||element.parent().is(".input-append")){
			error.appendTo(element.parent().parent());
		} else {
			error.insertAfter(element);
		}
	}
});
 

有了這些基礎的知識，校驗起來就方便了很多！

下面給出大體的程式碼，需要的話可以自己除錯一下！思路為：判斷iframe的數量，計算校驗通過的iframe的頁面數量，兩者相等表示全部校驗通過，然後再去執行其他的方法！

//所有iframe子頁面專案校驗  
sonFormValidate : function(){
	var length= $("#inputForm").find("iframe").length;//需要校驗的頁面數量 
	var i=0;//最後代表校驗通過的頁面 
	$("#inputForm").find("iframe").each(function(){
		var okFlag=$(this).contents().find("#inputForm").valid();
		if(okFlag){
		 i++; 
		}
	});
	//所有頁面校驗通過  
	if(length==i){
		return true;
	}else{//部分頁面不通過 
		return false;
	} 
}
 

僅以此文章記錄在開發過程中遇到的問題，方便後續檢視校驗！