JQuery的datetimepicker插件,起始日期&結束日期相互約束

bootstrap-datetimepicker 的連接地址

1、html 部分

<div class="row">
    <div class="col-md-3 col-sm-3 col-xs-6 ">
        <input type="text" class="form-control" id="dateFrom" placeholder="開始日期"  value="" />
    </div>
    <div class="col-md-3 col-sm-3 col-xs-6 ">
        <input type="text" class="form-control" id="dateTo" placeholder="結束日期"  value="" />
    </div>
</div>

2、jquery 部分

一、封裝函數

//起始日期和結束日期的對照判斷
function dateControl(objStart,objEnd){
    var starttime,endtime;
    objStart.datetimepicker({
        minView:2, //選擇日期後，不會再跳轉去選擇時分秒
        format: 'yyyy-mm-dd', //日期格式
        language:'zh-CN', //漢化
        autoclose:true, //選擇日期後自動關閉
        top:'top-left',
    }).on("changeDate",function(ev){
        starttime=objStart.val();
        objEnd.datetimepicker('setStartDate',starttime);  //end 的開始日期
        objStart.datetimepicker('hide');
    });
    objStart.datetimepicker('setEndDate',getLocalTime(new Date()));
    
    objEnd.datetimepicker({
        minView:2, //選擇日期後，不會再跳轉去選擇時分秒
        format: 'yyyy-mm-dd', //日期格式
        language:'zh-CN', //漢化
        autoclose:true, //選擇日期後自動關閉
        top:'top-left',
    }).on("changeDate",function(ev){
        starttime=objStart.val();
        endtime=objEnd.val();
        if(starttime!=""&&endtime!=""){
            if(starttime>endtime){
                objEnd.val("");
                swal("開始時間大於結束時間！");
                return;
            }
        }
        objStart.datetimepicker('setEndDate',endtime);   //start 的結束日期
        objEnd.datetimepicker('hide');
    });
    objEnd.datetimepicker('setEndDate',getLocalTime(new Date()));
}

二、調用

dateControl($('#dateFrom'),$("#dateTo"));

3、備註

上面日期對照函數中的 getLocalTime()函數是以前封裝的轉換日期格式的函數，以下：

//能夠將把時間戳轉爲普通格式
function getLocalTime(now) {
    now = new Date(now);
    var year = now.getFullYear();
    var month = now.getMonth() + 1;
    var date = now.getDate();
    var hour = now.getHours();
    var minute = now.getMinutes();
    var second = now.getSeconds();
    if(month<10){
        month="0"+month;
    }
    return year + "-" + month + "-" + date ;
}