地址：http://www.daterangepicker.com/
demo地址:http://tamble.github.io/jquery-ui-daterangepicker/#event
api
参数
startDate: （日期对象、实践对象或者字符串）初始开始时间
endDate: （日期对象、实践对象或者字符串） 初始结束时间
minDate: （日期对象、实践对象或者字符串） 可选最早时间
maxDate: （日期对象、实践对象或者字符串） 可选最晚时间
dateLimit: (对象) 选择开始日期和结束日期之间的最大跨度
timeZone: (字符串或数字) 时区，默认为本地时区
showDropdowns: (布尔) 在年月份选择框上面显示可以跳刀特定月份的选择
showWeekNumbers: (布尔) 日历的每周前显示周数
timePicker: (布尔) 是否显示时间选择框
timePickerIncrement: (数字) 步长
timePicker12Hour: (布尔) 使用12小时制替代24小时，并添加AM/PM下拉框选项
timePickerSeconds: (布尔) 时间选择框是否显示秒数
ranges: (对象) 设定预定义日期范围
opens: (字符串: 'left'/'right'/'center')选择相对日期框的相对位置
buttonClasses: (数组) 自定义按钮样式
applyClass: (字符串) 自定义按钮样式（apply/应用）
cancelClass: (字符串) 自定义按钮样式（cancle/取消）
format: (字符串) Date/time 结果时间格式
separator: (字符串) 开始时间和结束时间的分割字符
locale: (对象) 本地化
singleDatePicker: (布尔) 只显示一个时间
parentEl: (string) 容器，缺省为body
》》》》》》初始化插件《《《《《《
$('#reportrange').daterangepicker(
{
// startDate: moment().startOf('day'),
//endDate: moment(),
//minDate: '01/01/2012', //最小时间
maxDate : moment(),
//最大时间
dateLimit : {
days : 30
},
//起止时间的最大间隔
showDropdowns :
true
,
showWeekNumbers :
false
,
//是否显示第几周
timePicker :
true
,
//是否显示小时和分钟
timePickerIncrement : 60,
//时间的增量，单位为分钟
timePicker12Hour :
false
,
//是否使用12小时制来显示时间
ranges : {
//'最近1小时': [moment().subtract('hours',1), moment()],
'今日'
: [moment().startOf(
'day'
), moment()],
'昨日'
: [moment().subtract(
'days'
, 1).startOf(
'day'
), moment().subtract(
'days'
, 1).endOf(
'day'
)],
'最近7日'
: [moment().subtract(
'days'
, 6), moment()],
'最近30日'
: [moment().subtract(
'days'
, 29), moment()]
},
opens :
'right'
,
//日期选择框的弹出位置
buttonClasses : [
'btn btn-default'
],
applyClass :
'btn-small btn-primary blue'
,
cancelClass :
'btn-small'
,
format :
'YYYY-MM-DD HH:mm:ss'
,
//控件中from和to 显示的日期格式
separator :
' to '
,
locale : {
applyLabel :
'确定'
,
cancelLabel :
'取消'
,
fromLabel :
'起始时间'
,
toLabel :
'结束时间'
,
customRangeLabel :
'自定义'
,
daysOfWeek : [
'日'
,
'一'
,
'二'
,
'三'
,
'四'
,
'五'
,
'六'
],
monthNames : [
'一月'
,
'二月'
,
'三月'
,
'四月'
,
'五月'
,
'六月'
,
'七月'
,
'八月'
,
'九月'
,
'十月'
,
'十一月'
,
'十二月'
],
firstDay : 1
}
},
function
(start, end, label) {
//格式化日期显示框
$(
'#reportrange span'
).html(start.format(
'YYYY-MM-DD HH:mm:ss'
) +
' - '
+ end.format(
'YYYY-MM-DD HH:mm:ss'
));
});