datetimepicker时间控件控制前后日期(开始日期不能大于结束日期)互相限制

$(function () {
    //开始日期1 可选择时间
    //$("#fld_FROMDATE").datetimepicker({
    //    format: 'yyyy-mm-dd hh:ii:ss',
    //    minuteStep: 1,
    //    minView: 'hour',
    //    language: 'zh-CN',
    //    pickerPosition: 'bottom-right',
    //    autoclose: true,
    //}).on("click", function () {
    //    $("#fld_FROMDATE").datetimepicker("setEndDate", $("#fld_ENDDATE").val());//点击了结束日期1之后限制开始时间1的最晚日期
    //});

    $("#fld_FROMDATE").datetimepicker("setDate", new Date('2019 / 09 / 17 08:00'));//自定义时间
    document.getElementById("fld_FROMDATE").disabled = true;//禁用该时间控件

    $(document).on("click", "#fld_FROMDATE", function () {
        $('#fld_FROMDATE').datetimepicker('show');
    });

    //开始日期2
    $("#fld_BEGIN").datetimepicker({
        format: 'yyyy-mm-dd hh:ii:ss',
        minuteStep: 1,
        minView: 'hour',
        language: 'zh-CN',
        pickerPosition: 'bottom-right',
        autoclose: true,
    }).on("click", function () {
        $("#fld_BEGIN").datetimepicker("setEndDate", $("#fld_ENDDATE").val());//最晚时间为结束时间1的时间
        if ($("#fld_END").val() != "") {
            $("#fld_BEGIN").datetimepicker("setEndDate", $("#fld_END").val());//如果结束时间2的时间不为空时,最晚时间为结束时间2的时间
        }
        $("#fld_BEGIN").datetimepicker("setStartDate", $("#fld_FROMDATE").val());//最早时间为开始时间1的时间
    });
    $(document).on("click", "#fld_BEGIN", function () {
        $('#fld_BEGIN').datetimepicker('show');
    });

    //结束日期1 可选择时间
    //$("#fld_ENDDATE").datetimepicker({
    //    format: 'yyyy-mm-dd hh:ii:ss',
    //    minuteStep: 1,
    //    minView: 'hour',
    //    language: 'zh-CN',
    //    autoclose: true,
    //}).on("click", function () {
    //    $("#fld_ENDDATE").datetimepicker("setStartDate", $("#fld_FROMDATE").val());//
    //});

    $("#fld_ENDDATE").datetimepicker("setDate", new Date('2019 / 09 / 27 18:00'));//自定义时间
    document.getElementById("fld_ENDDATE").disabled = true;//禁用该时间控件


    $(document).on("click", "#fld_ENDDATE", function () {
        $('#fld_ENDDATE').datetimepicker('show');
    });

    //结束日期2
    $("#fld_END").datetimepicker({
        format: 'yyyy-mm-dd hh:ii:ss',
        minuteStep: 1,
        minView: 'hour',
        language: 'zh-CN',
        autoclose: true,
    }).on("click", function () {
        $("#fld_END").datetimepicker("setStartDate", $("#fld_FROMDATE").val());//最早时间为开始时间1的时间
        if ($("#fld_BEGIN").val()!="") {
            $("#fld_END").datetimepicker("setStartDate", $("#fld_BEGIN").val());//如果开始时间2的时间不为空时,最早时间为开始时间2的时间
        }
        $("#fld_END").datetimepicker("setEndDate", $("#fld_ENDDATE").val());//最晚时间为结束时间1的时间
    });
    $(document).on("click", "#fld_END", function () {
        $('#fld_END').datetimepicker('show');
    });

    document.getElementById("fld_DAYS").disabled = true;//禁用该文本框

    //计算出开始时间和结束时间的相隔时间(天)
    $("body").mouseover(function () {
        var begintime = $("#fld_FROMDATE").val();
        var endtime = $("#fld_ENDDATE").val();
        if (begintime == "" || endtime == "") {
            return;
        }
        var startDate = Date.parse(begintime.replace('/-/g', '/'));
        var endDate = Date.parse(endtime.replace('/-/g', '/'));
        var diffDate = (endDate - startDate) + 1 * 24 * 60 * 60 * 1000;
        var days = diffDate / (1 * 24 * 60 * 60 * 1000);
        //判断是否为整数,如果不为整数,则数值加一取整
        if (days % 1 != 0) {
            days += 1;
            days = Math.floor(days);
        }
        document.getElementById("fld_DAYS").value = days;
    })
})

页面效果图
页面效果

你可能感兴趣的:(datetimepicker时间控件控制前后日期(开始日期不能大于结束日期)互相限制)