JS选择日期控件。需要使当前日期以后的日期不能选择

$.extend($.fn.datebox.defaults.rules,{   gtStartDate: {   validator: function(value,param){//   if(param[0] && value)   {   if(value.length > 10)   {   value = value.substring(0,10);   }   var ed_arr = value.split('-');   var endDate = new Date(ed_arr[0],ed_arr[1]-1,ed_arr[2]);   var sDate = $(param[0]).datebox('getValue');   if(sDate)   {   if(sDate.length > 10)   {   sDate = sDate.substring(0,10);   }   var sd_arr = sDate.split('-');   var startDate = new Date(sd_arr[0],sd_arr[1]-1,sd_arr[2]).getTime();   if((endDate.getTime() - startDate) > 0)   {   return true;   }   }   }   return false;   },   message:"结束时间必须大于开始时间"       }       });   /*

页面使用方式：

for="inforCommend.startDate">开始时间:</label></td><td><input  class="easyui-datebox" type="text" name="inforCommend.startDate" required=true editable="false"id="infor_commend_startDate" /></td><td width="20"></td><td nowrap="nowrap" align="right"><labelfor="inforCommend.endDate">结束时间:</label></td><td><input class="easyui-datebox"  type="text" name="inforCommend.endDate" editable="false" required=true validType="gtStartDate['#infor_commend_startDate']" invalidMessage="结束时间必须大于开始时间"id="infor_commend_endDate" /></td>

*/   $.extend($.fn.datebox.defaults.rules,{   ltCurrentDate: {   validator: function(value,param){   if(value)   {   if(value.length > 10)   {   value = value.substring(0,10);   }   var ed_arr = value.split('-');   var selectedDate = new Date(ed_arr[0],ed_arr[1]-1,ed_arr[2]);   var currentDate = new Date();   if((currentDate.getTime() - selectedDate.getTime()) >= 0)   {   return true;   }   }   return false;   },   message:"日期必须小于等于当前日期"       }       });

 由于项目是使用的easyui 但是查了下easyui datebox 发现没有提供类似的属性。

于是自己写了个ltCurrentDate 的校验方式。

当表单 提交或鼠标移开是会进行验证。如果不合法此会弹出invalidMessage属性的提示信息。

验证了可以使用。但是当提交按钮和日期input需要页面滚动才能看到彼此时。问题就来了。表单提交。

触发验证，提示信息已经弹出来了，但是当页面滚到日期input时，提示信息是没有的。而且日期input由于是editable=false的。所以不能获得focus，所以用户看不出哪里不合法。晕了。

于是找来下先jquery ui中的 datepicker插件不错，而且支持这个需求。

需要文件;

 jquery-ui-1.8.21.custom.min.js
<link type="text/css" href="<%=commonCssPath %>/jquery-ui-1.8.21.custom.css" rel="Stylesheet" /> 

jquery.ui.datepicker-zh-CN.js:

;jQuery(function($){$.datepicker.regional["zh-CN"]={closeText:"关闭",prevText:"<上月",nextText:"下月>",currentText:"今天",monthNames:["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"],monthNamesShort:["一","二","三","四","五","六","七","八","九","十","十一","十二"],dayNames:["星期日","星期一","星期二","星期三","星期四","星期五","星期六"],dayNamesShort:["周日","周一","周二","周三","周四","周五","周六"],dayNamesMin:["日","一","二","三","四","五","六"],weekHeader:"周",dateFormat:"yy-mm-dd",firstDay:1,isRTL:!1,showMonthAfterYear:!0,yearSuffix:"年"},$.datepicker.setDefaults($.datepicker.regional["zh-CN"]);});

如何使用：

$('#i_startDate').datepicker({maxDate:new Date()});

更多属性参见官方文档。http://api.jqueryui.com/datepicker/