一.前言
最近在優(yōu)化項(xiàng)目前端，老板非想要一個(gè)時(shí)間范圍的選擇，覺得用兩個(gè)時(shí)間輸入框操作不便?？吹骄W(wǎng)上有三種：分別是mobiscroll，用于手機(jī)端；jquery下的插件 Date Range Picker；基于bootstrap的daterangepicker。看了下官方文檔，Date Range Picker和daterangepicker樣子差不多。想著項(xiàng)目大體用的bootstrap，那就用daterangepicker吧。結(jié)果發(fā)現(xiàn)好多操作不便的小問題（不知道是不是我操作方式奇葩。。。）。善始善終，那就改源碼吧。
二、小bug修復(fù)
1.輸入框默認(rèn)值為當(dāng)前時(shí)間，可我們要自己的提示咋辦，"autoUpdateInput":false可以做到，但是，它居然讓輸入框一直都沒值，這就不好了。百度了下，機(jī)智的網(wǎng)友給出了解決方案，在某些地方，設(shè)置autoUpdateInput為true。
a. clickRange方法修改成如下：
} else if (!this.endDate && date.isBefore(this.startDate)) {
this.autoUpdateInput = true;
//special case: clicking the same date for start/end,
//but the time of the end date is before the start date
this.setEndDate(this.startDate.clone());
} else { // picking end
this.autoUpdateInput = true;
var dates = this.ranges[label];
this.startDate = dates[0];
this.endDate = dates[1];

            if (!this.timePicker) {
                this.startDate.startOf('day');
                this.endDate.endOf('day');
            }

            if (!this.alwaysShowCalendars)
                this.hideCalendars();
            this.clickApply();
        }
b.clickDate方法中增加
  } else if (!this.endDate && date.isBefore(this.startDate)) {
            this.autoUpdateInput = true;
            //special case: clicking the same date for start/end,
            //but the time of the end date is before the start date
            this.setEndDate(this.startDate.clone());
        } else { // picking end
            this.autoUpdateInput = true;

2.打開日期控件后，點(diǎn)擊外邊空白處以及選了時(shí)間，但是沒有點(diǎn)“確定”而是點(diǎn)”取消“后，時(shí)間控件輸入框會(huì)寫入時(shí)間。
a.clickCancel方法注釋掉this.hide(),改成以下代碼：
if (this.isShowing){
$(document).off('.daterangepicker');
$(window).off('.daterangepicker');
this.container.hide();
this.element.trigger('hide.daterangepicker', this);
this.isShowing = false;
}
b.outsideClick方法中也像上面那樣將this.hide()改掉
c.show方法中，改成如下，注釋掉的為原來的，下面是新增的
// this.oldStartDate = this.startDate.clone();
// this.oldEndDate = this.endDate.clone();
// this.previousRightTime = this.endDate.clone();

        this.oldStartDate = this.startDate;
        this.oldEndDate = this.endDate;
        this.previousRightTime = this.endDate;

3.鼠標(biāo)移到日期選擇的某個(gè)日期時(shí)，上面對應(yīng)的輸入框的值也會(huì)跟著一直變化，但是當(dāng)我選擇了兩個(gè)日期后，鼠標(biāo)再移在上面，還變化就不好了，讓我以為上面開始時(shí)間和結(jié)束時(shí)間輸入框數(shù)據(jù)出了問題，所以一氣之下，去掉了這個(gè)特性。
hoverDate方法中，將下面兩行注釋掉（以下代碼我注釋的部分就是）：
if (this.endDate && !this.container.find('input[name=daterangepicker_start]').is(":focus")) {
// this.container.find('input[name=daterangepicker_start]').val(date.format(this.locale.format));
} else if (!this.endDate && !this.container.find('input[name=daterangepicker_end]').is(":focus")) {
// this.container.find('input[name=daterangepicker_end]').val(date.format(this.locale.format));
}