datepicker 使用日期范围限定-前端-MiThink 记事本

datepicker 使用日期范围限定

DATE: 2014-12-18 / VIEWS: 1067

 <script type="text/javascript">
$(function(){
  $("#start_date").datepicker({
    dateFormat:'yy-mm-dd',
    onSelect:function(dateText,inst){
       $("#end_date").datepicker("option","minDate",dateText);
       $("#end_date").datepicker("option","maxDate",new Date(getTimeByDateStr(dateText)+30*24*60*60*1000));
    }
  });
  $("#end_date").datepicker({
    dateFormat:'yy-mm-dd',
    onSelect:function(dateText,inst){
       $("#start_date").datepicker("option","minDate",new Date(getTimeByDateStr(dateText)-30*24*60*60*1000));
       $("#start_date").datepicker("option","maxDate",dateText);
    }
  });
})
function getTimeByDateStr(dateStr){
    var year = parseInt(dateStr.substring(0,4));
    var month = parseInt(dateStr.substring(5,7),10)-1;
    var day = parseInt(dateStr.substring(8,10),10);
    return new Date(year, month, day).getTime();
}
</script>

把百度的Jquery UI的CDN放上来，备不时之需。