laydate设置开始时间和结束时间范围选择，js文件实现基类封装，全局调用

var startDate, endDate;
// 初始化时间选择控件
function initTimeRange(startTimeId, endTimeId, startFormat, endFormat, startTypeName, endTypeName) {
    startFormat = startFormat || "yyyy-MM-dd HH:mm:ss";
    endFormat = endFormat || "yyyy-MM-dd HH:mm:ss";
    let startType = startTypeName || "";
    let endType = endTypeName || "";
    if (startType == "") {
        if (startFormat == "yyyy-MM-dd HH:mm:ss" || startFormat == "yyyy/MM/dd HH:mm:ss") {
            startType = "datetime";
        } else {
            startType = "date";//默认
        }
    }
    if (endType == "") {
        if (endFormat == "yyyy-MM-dd HH:mm:ss" || endFormat == "yyyy/MM/dd HH:mm:ss") {
            endType = "datetime";
        } else {
            endType = "date";//默认
        }
    }
    startDate = laydate.render({
        elem: '#' + startTimeId,
        type: startType,
        format: startFormat,
        theme: '#4d99cf',
        done: function (value, date) {
            if (value != "") {
                date.month = date.month - 1;
                endDate.config.min = date;
            } else {
                endDate.config.min = startDate.config.min;
            }
        }
    });
    endDate = laydate.render({
        elem: '#' + endTimeId,
        type: endType,
        format: endFormat,
        theme: '#4d99cf',
        done: function (value, date) {
            if (value != "") {
                date.month = date.month - 1;
                startDate.config.max = date;
            } else {
                startDate.config.max = endDate.config.max;
            }
        }
    });
}

// 获取指定类型时间访问
function setTimeRange(startTimeId, endTimeId, dataTarget) {
    let startTime = null;
    let endTime = null;
    if (arguments.length == 3) {
        if (dataTarget == "") return;
        let date = new Date();
        if (dataTarget == 'today') {//今日
            startTime = date.format("yyyy-MM-dd");
            endTime = date.format("yyyy-MM-dd");
        } else if (dataTarget == 'yesterday') {//昨日
            date.setDate(date.getDate() - 1);
            startTime = date.format("yyyy-MM-dd");
            endTime = date.format("yyyy-MM-dd");
        } else if (dataTarget == 'thisWeek') {//本周
            let num = date.getDay() - 1;
            date.setDate(date.getDate() - num); //本周第一天
            startTime = date.format("yyyy-MM-dd");
            date.setDate(date.getDate() + 6);//本周最后一天
            endTime = date.format("yyyy-MM-dd");
        } else if (dataTarget == 'dayBefore') {//前一天
            if ($("#" + startTimeId).val() != "") {
                date = new Date(Date.parse($("#" + startTimeId).val()));
            }
            date.setDate(date.getDate() - 1);
            startTime = date.format("yyyy-MM-dd");
            endTime = date.format("yyyy-MM-dd");
        } else if (dataTarget == 'lastWeek') {//上周
            let weekStartDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() - 6);
            startTime = weekStartDate.format("yyyy-MM-dd");//上周第一天
            let weekEndDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay());
            endTime = weekEndDate.format("yyyy-MM-dd");//上周最后一天
        } else if (dataTarget == 'thisMonth') {//本月
            date.setDate(1);//本月第一天
            startTime = date.format("yyyy-MM-dd");
            date.setMonth(date.getMonth() + 1);//下个月
            date.setDate(date.getDate() - 1);//下个月第一天减1得到本月最后一天
            endTime = date.format("yyyy-MM-dd");
        } else if (dataTarget == 'lastMonth') {//上月
            date.setDate(1);//本月第一天
            date.setDate(date.getDate() - 1);//本月第一天减1得到上月最后一天
            endTime = date.format("yyyy-MM-dd");
            date.setDate(1);//上月第一天
            startTime = date.format("yyyy-MM-dd");
        } else if (dataTarget == 'dayAfter') {//后一天
            if ($("#" + endTimeId).val() != "") {
                date = new Date(Date.parse($("#" + endTimeId).val()));
            }
            date.setDate(date.getDate() + 1);
            startTime = date.format("yyyy-MM-dd");
            endTime = date.format("yyyy-MM-dd");
        }
        if (startTime != null)
            startTime += " 00:00:00";
        if (endTime != null)
            endTime += " 23:59:59";
    }
    else if (arguments.length == 4) {
        startTime = arguments[2];
        endTime = arguments[3];
    }

    let txtStartTime = $("#" + startTimeId);
    let txtEndTime = $("#" + endTimeId);

    if (startTime != null && startTime != "") {
        let startTimeDateformat = startDate.config.format;
        if (startTimeDateformat != undefined && startTimeDateformat != "") {
            txtStartTime.val(new Date(startTime).format(startTimeDateformat));
        } else {
            txtStartTime.val(startTime);
        }
        try {
            let startDateTemp = new Date(txtStartTime.val());
            endDate.config.min = {
                "year": startDateTemp.getFullYear(), "month": startDateTemp.getMonth(), "date": startDateTemp.getDate(),
                "hours": startDateTemp.getHours(), "minutes": startDateTemp.getMinutes(), "seconds": startDateTemp.getSeconds()
            };
        } catch (e) {
            console.log(e);
        }
    }

    if (endTime != null && endTime != "") {
        let endTimeDateformat = endDate.config.format;
        if (endTimeDateformat != undefined && endTimeDateformat != "") {
            txtEndTime.val(new Date(endTime).format(endTimeDateformat));
        } else {
            txtEndTime.val(endTime);
        }
        try {
            let endDateTemp = new Date(txtEndTime.val());
            startDate.config.max = {
                "year": endDateTemp.getFullYear(), "month": endDateTemp.getMonth(), "date": endDateTemp.getDate(),
                "hours": endDateTemp.getHours(), "minutes": endDateTemp.getMinutes(), "seconds": endDateTemp.getSeconds()
            };
        } catch (e) {
            console.log(e);
        }
    }
}

调用示例

<label class="control-label">日期</label>
            <input id="txtBeginTime" type="text" class="input form-control" style="width:100px" value="@DateTime.Now.ToString("yyyy-MM-dd")" />&ensp;
            <label class="control-label">~</label>
            <input id="txtEndTime" type="text" class="input form-control" style="width:100px" value="@DateTime.Now.ToString("yyyy-MM-dd")" />&ensp;

 

initTimeRange("txtBeginTime", "txtEndTime");或 initTimeRange("txtBeginTime", "txtEndTime","yyyy-MM-dd","yyyy-MM-dd","date","date");

setTimeout(function () { setTimeRange("txtBeginTime", "txtEndTime", $("#txtBeginTime").val(), $("#txtEndTime").val()); }, 100);

注意：使用官网演示的一个文本框进行时间范围选择，以上方法不适用

 

laydate对比My97Datepicker更适合基于bootstrap的前端框架
bootstrap的时间控件，有空再研究