时间控件daterangepicker 小bug 修复

Dear 丶 2021-10-08 07:06 393阅读 0赞

**BUG ①**

描述：时间控件在选中时间后 未点击确定或者取消 而是点击了空白部分，按理说这应该默认为取消 然而实际是确认 在国外是很正常的但这不符合中国习惯

如图：![Image 1][]![Image 1][]

正常应该还是三月七号 而实际变成了三月三十一号

**解决方案**

**   ** 找到对应的js文件，如图所示：![Image 1][]

**找到outsideClick方法**

**将该方法替换成**

outsideClick: function(e) {
                var target = $(e.target);
                // if the page is clicked anywhere except within the daterangerpicker/button
                // itself then call this.hide()
                if (
                    // ie modal dialog fix
                    e.type == "focusin" ||
                    target.closest(this.element).length ||
                    target.closest(this.container).length ||
                    target.closest('.calendar-table').length
                    ) return;
                this.startDate = this.oldStartDate;
                this.endDate = this.oldEndDate;
                this.container.hide();
                this.isShowing = false;
                this.element.trigger('outsideClick.daterangepicker', this);
    
            },

**BUG ②**

** 描述：当下拉框改变后 将新的值赋值到时间文本框中  然后点击时间文本框 发现选中的时间还是未改变（初始化）的时间 ，正常应该是改变后的时间被选中**

**如图所示1![Image 1][]**

**如图所示2![Image 1][]**

**解决方案**

**在chang（）事件中添加下面那段代码**

**重点是**

formatDateNew(order_data[dd][6]),表示chang后最新的时间  格式要转成年-月-日 时分秒格式 下方是做了国际化 你可以直接换成中文

startDate:formatDateNew(order_data[dd][6]),

$('#scheduledEndTime').daterangepicker({
        startDate: formatDateNew(order_data[dd][6]),
        showDropdowns: true,
        showWeekNumbers: false,
        changeMonth: true,
        changeYear: true,
        timePicker: true,
        timePickerIncrement: 2,
        singleDatePicker: true,
        timePicker24Hour: true,
        locale: { //中文汉化
            format: 'YYYY-MM-DD HH:mm:ss',
            applyLabel: '' + $.i18n.prop('i18n_sure'),
            cancelLabel: '' + $.i18n.prop('i18n_cancel'),
            daysOfWeek: ['' + $.i18n.prop('星期天'), '' + $.i18n.prop('星期一'), '' + $.i18n.prop('星期二'), '' + $.i18n.prop('星期三'), '' + $.i18n.prop('星期四'), '' + $.i18n.prop('星期五'), '' + $.i18n.prop('星期六')],
            monthNames: ['' + $.i18n.prop('i18n_january'), '' + $.i18n.prop('i18n_february'), '' + $.i18n.prop('i18n_march'), '' + $.i18n.prop('i18n_april'), '' + $.i18n.prop('i18n_may'), '' + $.i18n.prop('i18n_june'), '' + $.i18n.prop('i18n_july'), '' + $.i18n.prop('i18n_august'), '' + $.i18n.prop('i18n_september'), '' + $.i18n.prop('i18n_october'), '' + $.i18n.prop('i18n_november'), '' + $.i18n.prop('i18n_december')],
            firstDay: 1
        }
    });

[Image 1]: