自己写的jQuery下的验证框架，支持自定义验证函数，支持自定义错误显示效果

这两天需要写个验证器，一开始就写了个空值验证方法，主要针对文本框和FCKeditor，后来觉得功能太有限，不方便扩展。后来就改成现在这个样子，一个Validator验证一个表单，多个表单可以用多个验证器验证（这个还没试）。支持自定义验证函数,(Vaildtor.addSheduleType()方法添加自定义验证函数，默认有两个)，支持自定义显示错误信息效果(这里提供常规对话框和jQuery dialog插件两种效果，通过Vaildtor.setCustomMessageBox方法添加自定义显示效果的实例)。bug可能还有好多我没发现，但现在基本上能用了，欢迎大家评测，如果发现bug或有建议，请不吝赐教，我也很辛苦啊，现在都午夜1:37了。

需要的js和css请在jQuery官网上下载，清单如下：

<link type="text/css" href="themes/base/ui.core.css" rel="stylesheet" />
<link type="text/css" href="themes/base/ui.theme.css" rel="stylesheet" />
<link type="text/css" href="themes/base/ui.dialog.css" rel="stylesheet" />

<script type="text/javascript" src="js/ui.core.js"></script>
<script type="text/javascript" src="js/jquery.bgiframe.js"></script>
<script type="text/javascript" src="js/ui.dialog.js"></script>

对此感兴趣的朋友也请关注一下我的这篇帖子，是前天的版本，其中提到的问题现在还是没有好的解决方案。

http://hi.csdn.net/link.php?url=http://topic.csdn.net%2Fu%2F20091227%2F15%2F632d5900-574c-42a0-83ff-d57a8357a8d3.html

<!--
/*！
 *验证器
 *@author 胡海
 */
 var MSG=[];
/*!
 *验证任务
 *@parm type 验证类型
 *@param parameters 验证动作参数列表
 */
function Shedule(type,parameters)
{
	this.type=type;
	this.parameters=parameters;
}

/*!
 *任务类型
 *@param type 验证类型
 *@param action 验证动作
 */
function SheduleType(type,action)
{
	this.type=type;
	this.action=action;
}

/*!验证框架
 *@param form 要验证的表单（jQuery包装过的对象）
 */
function Validator(form)
{
	this.form=form;						
	this.sheduleList=[];				//任务列表
	this.customMessageBox=null;			//用户自定义的消息框（默认为空）
	this.config=						//配置
		{
			showMessageTogether:true, 	//showMessageTogether（是否同时显示消息）
			useUI:false					//useUI 是使用jQuery UI插件显示消息
		};
	this.sheduleTypeList=				//任务类型列表
		[
			new SheduleType('EMPTY_VALUE',checkEmptyContent),
			new SheduleType("INVILD_EMAIL",checkInvildEmail)
		];
	
	/*!
	 *添加消息
	 *@param msg 消息
	 */
	this.addMsg=function(msg)
		{	
			if(msg!=null && msg!=undefined && jQuery.trim(msg)!='')
			{
				MSG[MSG.length]=msg; 
			}
		};
	
	/*!
	 *显示消息
	 *@param messageBox 用户自定义的消息显示对话框实例（必须实现showMessage接口）
	 */
	this.showMsg=function()
		{			
			var msg='';
			for(var i=0;i<MSG.length;i++)
			{
				if(this.config.showMessageTogether)
				{
					if(this.config.useUI && this.customMessageBox!=null)
						msg+=MSG[i]+'<br/>';
					else
						msg+=MSG[i]+'/n';
				}
				else
				{
					if(this.config.useUI && this.customMessageBox!=null)
					{
						this.customMessageBox.init(MSG[i]);
						this.customMessageBox.showMessage();
					}
					else
						alert(MSG[i]);
				}
			}
			if(this.config.showMessageTogether)
			{
				if(this.config.useUI && this.customMessageBox!=null)
				{
					this.customMessageBox.init(msg);
					this.customMessageBox.showMessage();
				}
				else	
					alert(msg);
			}
		};
	
	
	/*!
	 *执行任务
	 *@param shedule 任务
	 */
	this.doShedule=function(shedule)
	{	
		for(var i=0;i<this.sheduleTypeList.length;i++)
			if(shedule.type=this.sheduleTypeList[i].type)
			{	
				return this.sheduleTypeList[i].action(shedule.parameters,this.addMsg);
			}
		
	};
}
	/*!
	 *获取任务类型列表
	 */
	Validator.prototype.getSheduleTypeList=function()
	{
		return this.sheduleTypeList;
	};
	
	/*!
	 *添加任务类型
	 *@param type 验证类型
	 *@param action 任务动作
	 */
	Validator.prototype.addSheduleType=function(type,action)
	{
		this.sheduleTypeList[this.sheduleType.length]=new SheduleType(type,action);
	}
	
	/*!
	 *添加任务
	 *@param type 验证类型
	 *@parm params 验证动作参数列表
	 */
	Validator.prototype.addShedule=function(type,params)
	{
		this.sheduleList[this.sheduleList.length]=new Shedule(type,params);
	};
	
	/*!
	 *修改配置
	 */
	Validator.prototype.setConfig=function(params)
	{
		jQuery.extend(this.config,params);
	};
	
	/*!
	 *获取配置
	 */
	Validator.prototype.getConfig=function()
	{
		return this.config;
	};
	
	/*!
	 *设置用户自定义的消息显示框
	 *@param messageBox
	 */
	Validator.prototype.setCustomMessageBox=function(messageBox)
	{
		this.customMessageBox=messageBox;
	};
	
	/*!
	 *获取用户自定义的消息显示框
	 *@param messageBox
	 */
	Validator.prototype.getCustomMessageBox=function()
	{
		return this.customMessageBox;
	};
	
	/*!
	 *部署验证
	 */
	Validator.prototype.deployVaildShedule=function()
	{
		var temp=this;
		this.form.submit(
			function(event)
			{
				MSG=[];//清空消息
				var flag=true;
				for(var i=0;i<temp.sheduleList.length;i++)
				{
					flag=flag & temp.doShedule(temp.sheduleList[i]);//很郁闷这里非得使用"&"，实在觉得很奇怪，不应该是"&&"吗?
				}
				if(flag==false)
				{
					temp.showMsg();
					event.preventDefault();
				}
			}			
		);		
	};
//==================================自定义显示消息====================================
	/*!
	 *使用jQuery UI显示消息
	 */
	function MessageDialog()
	{
		this.buffer=[];					//缓存
		this.doBufferTask=false;		//是否正在执行缓存任务
		this.config=
		{
			useModal:false,				//是否使用模态窗口（针对使用UI插件）
			useBGIframe:false			//是否使用iframe屏蔽层（针对使用UI插件，解决IE6下select始终显示在div之上的bug，需要bgiframe插件支持）	
		};
		
		/*!
		 *初始化
		 */
		this._init=function(msg)
		{
			var temp=this;
			if(document.getElementById('_DIALOG_')==null)
				$('body').css('font-size','62.5%').append('<div id="_DIALOG_">'+msg+'</div>');	
			else
			{
				//因为一次只能显示一个dialog，所以在不同时显示消息时将任务缓存下来，等dialog关闭时再依次显示缓存任务
				
				if($("#_DIALOG_").dialog('isOpen'))
				{
					if(!temp.doBufferTask)//如果正在执行缓存任务则不缓存
						temp.buffer[temp.buffer.length]=msg;//缓存任务
				}
				else
					$("#_DIALOG_").html(msg);//执行必需的清理工作，以免影响下次显示的内容
			}
		};
		/*!
		 *显示消息
		 *@param msg 消息
		 */
		this.showMsg=function()
		{					
			var temp=this;
			if($("#_DIALOG_").dialog)//需要jQuery dialog插件支持
			{
				$("#_DIALOG_").dialog 
				(
					{
						bgiframe:temp.config.useBGIframe,
						modal:temp.config.useModal,
						autoOpen:false,
						buttons: {
							Ok: function() {
								$(this).dialog('close');
								if(temp.buffer.length>0)//如果有缓存则执行缓存任务
									temp.doBufferTask=true;//设置为正在执行缓存任务
								for(var i=0;i<temp.buffer.length;i++)
								{
									temp._init(temp.buffer[i]);
									temp.showMsg();
									if(i+1==temp.buffer.length)
									{										
										temp.buffer=[];//清空缓存
										temp.doBufferTask=false;//设置缓存任务执行完毕
									}
								}
							}
						}
					}
				).css({'font-size':'14px'});
				$("#_DIALOG_").dialog('open');				
			}
		};	
	}	
	
	/*!
	 *显示消息 <必须实现的接口方法>
	 *@param msg 消息
	 */
	MessageDialog.prototype.showMessage=function()
	{
		this.showMsg();
	};
	
	/*!
	 *初始化<必须实现的接口方法>
	 */
	MessageDialog.prototype.init=function(msg)
	{
		this._init(msg);
	};
	
	/*!
	 *设置MessageDialog的配置
	 *参数列表
	 */	
	MessageDialog.prototype.setConfig=function(params)
	{
		jQuery.extend(this.config,params);
	};
	
	/*!
	 *获取MessageDialog的配置
	 */
	MessageDialog.prototype.getConfig=function()
	{
		return this.config;
	};
//==================================自定义验证函数====================================		
	/*!
	 *空值检查
	 *@param params 参数列表
	 *@param callback 回调函数
	 */
	checkEmptyContent=function(params,callback)
	{		
		input=params.input;								//input 要检查的输入控件 （jQuery包装过的对象）
		message=params.message;							//message 内容为空时的提示信息
		isFilterPragraphTag=params.isFilterPragraphTag;	//isFilterPragraphTag 是否过滤段落标记
		isFilterBlank=params.isFilterBlank;				//isFilterBlank 是否过滤空格
		if(input.val()!='')	
		{		  						    
			var noWarpContent=input.val();
			if(isFilterPragraphTag)//过滤段落标记
			{
				//过滤<p>标记
				while(noWarpContent.indexOf('<p>')>=0)
					noWarpContent=noWarpContent.replace('<p>','');
				//过滤</p>标记
				while(noWarpContent.indexOf('</p>')>=0)
					noWarpContent=noWarpContent.replace('</p>','');
			}
			if(isFilterBlank)//过滤空格
			{
				//过滤空格标记
				while(noWarpContent.indexOf('&nbsp;')>=0)
					noWarpContent=noWarpContent.replace('&nbsp;','');
				while(noWarpContent.indexOf('&nbsp')>=0)
					noWarpContent=noWarpContent.replace('&nbsp','');
				//过滤空格
				noWarpContent=jQuery.trim(noWarpContent);					
			}
			if(jQuery.trim(noWarpContent)!='')
			{				
				return true;
			}
		}
		callback(message);
		return false;
	};
	
    /*!
	 *检查邮件地址有效性
	 */
	checkInvildEmail=function(params,callback)
	{}
//-->

使用步骤如下：

注：尖括号中步骤是必需步骤，方括号中的步骤是可选的步骤。

1.<实例化验证框架>

[配置验证框架]
2.添加验证任务

[

1). <实例化自定义显示消息效果>

[配置自定义显示消息效果]
2).<添加自定义显示消息效果>

]

3.部署验证任务

实例代码如下：

<script type="text/javascript">
	        <!--
	            var validator=new Validator($('form.createTopic'));
	            validator.setConfig(
	            	{
	            		showMessageTogether:false,
	            		useUI:true
	            	}
	            );
	        	validator.addShedule('EMPTY_VALUE',
	        		{
	        			input:$('#input_inputTopic'),
	        			message:'主题标题不可以为空！',
	        			isFilterPragraphTag:true,
	        			isFilterBlank:true
	        		}
	        	);
	        	validator.addShedule('EMPTY_VALUE',
	        		{
	        			input:$('#content'),
	        			message:'主题内容不可以为空！',
	        			isFilterPragraphTag:true,
	        			isFilterBlank:true
	        		}
	        	);
	        	var dialog=new MessageDialog();	        	
	        	dialog.setConfig(
	        		{
	        			useModal:true,
	        			useBGIframe:true
	        		}
	        	);
	        	validator.setCustomMessageBox(dialog);
	        	validator.deployVaildShedule();
	        //-->
</script>

运行效果如图：