jquery-ui datepicker 日期控件 日期区间选择

1. 依赖文件

jquery   , jquery-ui.min.css,jquery-ui.min.js

2. html

从

到

3. js

$( "#fromData" ).datepicker({
     language: 'cn',  //汉化
     changeMonth: true,
     minDate: 0,  //日期从当天开始
     numberOfMonths: 1, //显示月的数量
     dateFormat: "yy-mm-dd", //日期格式化
     onClose: function( selectedDate ) {
       $( "#toData" ).datepicker( "option", "minDate", selectedDate );//限制日期范围
     }
   });
   $( "#toData" ).datepicker({
     language: 'cn',
     minDate: 0,
     changeMonth: true,
     numberOfMonths: 1,
     dateFormat: "yy-mm-dd",
     onClose: function( selectedDate ) {
       $( "#fromData" ).datepicker( "option", "maxDate", selectedDate );
     }
   });