完整的时间（开始和结束时间）输入框验证js

1、html

（1）时间输入框

Html代码  

1. 当使用时间插件改变时间时，会触发onchange()事件  
2.   
3. <p><span class="search_name">起始时间:</span>  
4.     <input type="text" id="starttime" readonly="readonly"  
5.     onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',lang:'zh-cn',maxDate:'%y-%M-%d',minDate:'%y-%M-<%=a%>{%d-2}'})"  
6.     onchange="checkNull('starttime')"/>  
7. </p>  
8. <p><span class="search_name">结束时间:</span>  
9.     <input type="text" id="endtime" readonly="readonly"  
10.     onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',lang:'zh-cn',maxDate:'%y-%M-%d',minDate:'%y-%M-<%=a%>{%d-2}'})"   
11.     onchange="checkNull('endtime')"/>  
12. </p>  

 (2)查询

Html代码  

1. <button type="button" onclick="query()" class="search_btn">查询</button>   

 

2、js

Js代码  

1. /*  
2.             检测时间是否为空 */  
3.         function checkNull(id){  
4.             //开始时间  
5.             if(id == "starttime"){  
6.                 startTime = $("#starttime").val();  
7.                   
8.                 if(isNull(startTime)){  
9.                     alert("起始时间不能为空");  
10.                     return false;  
11.                 }  
12.                 return true;  
13.             }  
14.               
15.             //结束时间  
16.             if(id == "endtime"){  
17.                 endTime = $("#endtime").val();  
18.                   
19.                 if(isNull(endTime)){  
20.                     alert("结束时间不能为空");  
21.                     return false;  
22.                 }  
23.                 return true;  
24.             }  
25.         }  
26.           
27.         /* 
28.             检测开始时间是否小于结束时间（字符串也可以之间比较难控制相差的时间长度，使用毫秒计算） */  
29.         function checkDate(){  
30.             var startTimeMills = getDateMillsByDateString("starttime");  
31.             var endTIimeMills =  getDateMillsByDateString("endtime");  
32.             //开始时间和结束世间的最大间隔：3天  
33.             var interval = 3*24*60*60*1000;  
34.               
35.             if(startTimeMills < endTIimeMills && 0 < endTIimeMills - startTimeMills < interval){  
36.                 return true;  
37.             }  
38.             alert("起始时间需要小于结束时间");  
39.             return false;  
40.         }  
41.           
42.         /* 
43.             查询 操作*/  
44.         function query(){  
45.             if(!checkNull('starttime')){  
46.                 return ;  
47.             }  
48.             if(!checkNull('endtime')){  
49.                 return;  
50.             }  
51.             if(!checkDate()){  
52.                 return;  
53.             }  
54.               
55.             $("#form1").submit();  
56.         }  
57.           
58.         //将字符串时间(yyyy-MM-dd HH:mm:ss)转换成毫秒  
59.         function getDateMillsByDateString(timeId){  
60.             var timeStr = $("#" + timeId).val();  
61.               
62.             var dateAndTimeArray = timeStr.split(" ");  
63.             var dateArray = dateAndTimeArray[0].split("-");  
64.             var timeArray = dateAndTimeArray[1].split(":");  
65.               
66.             var date = new Date(dateArray[0],dateArray[1],dateArray[2],timeArray[0],timeArray[1],timeArray[2]);  
67.               
68.             var dateMills = date.getTime();  
69.               
70.             return dateMills;  
71.         }  
72.           
73.           
74.         //判断字符串时间是否为空  
75.         function isNull(timeString){  
76.             if(timeString == null || timeString == ""){  
77.                 return true;  
78.             }  
79.             return false;  
80.         }