表单提交时,经常会需要对日期进行验证,比如结束时间必须大于开始时间。
可以通过jQuery validate 自定义一个验证方法,进行验证。
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
<form id="form1" name="form1" method="post" action="demo.html">
<p>timeStart:
<input name="timeStart" type="text" id="timeStart" value="2011-02-17 10:00:00"> yyyy-MM-dd HH:mm:ss
</p>
<p>timeEnd:
<input name="timeEnd" type="text" id="timeEnd" value="2011-02-17 9:00:00"> yyyy-MM-dd HH:mm:ss
</p>
<p>
<input type="submit" name="Submit" value="提交">
</p>
</form>
<SCRIPT LANGUAGE="JavaScript">
jQuery(function(){
jQuery.validator.methods.compareDate = function(value, element, param) {
//var startDate = jQuery(param).val() + ":00";补全yyyy-MM-dd HH:mm:ss格式
//value = value + ":00";
var startDate = jQuery(param).val();
var date1 = new Date(Date.parse(startDate.replace("-", "/")));
var date2 = new Date(Date.parse(value.replace("-", "/")));
return date1 < date2;
};
jQuery("#form1").validate({
focusInvalid:false,
rules:{
"timeStart":{
required: true
},
"timeEnd": {
required: true,
compareDate: "#timeStart"
}
},
messages:{
"timeStart":{
required: "开始时间不能为空"
},
"timeEnd":{
required: "结束时间不能为空",
compareDate: "结束日期必须大于开始日期!"
}
}
});
});
</SCRIPT>
以上是自定义方法,有三个参数的:其中的value是name值为‘timeEnd’的值;
param是
"timeEnd": {
required: true,
compareDate: "#timeStart"
}
中的对应的“#timeStart”,jQuery(param).val();即是input标签中id为timeStart的值;
element是name值为‘timeEnd’所在的标签。
通过Date.parse()方法将标准时间转化为时间戳
转为对象之后,就能够比较时间大小了。new Date()将时间戳转为日期对象