bootstrap --datetimepicker之时间段选择

文件引入

   <script type="text/javascript" src="css/jquery-3.2.1.js"></script>
    <link  rel="stylesheet" href="css/bootstrap.min.css" media="screen">
   <link rel="stylesheet" href="css/bootstrap-datetimepicker.css">
    <script src="https://cdn.bootcss.com/angular.js/1.4.6/angular.min.js"></script>
    <script src="dist/js/bootstrap-datetimepicker.js"></script>
   <script src="dist/js/bootstrap-datetimepicker.zh-CN.js"></script>

HTML：

<label>
    <input type='text' class='form-control ' id='dateBegin' name='date_begin' placeholder="beginTime..." value='' ng-model="dateBegin">
</label>
---
<label>
    <input type='text' class='form-control ' id='dateEnd' name='date_begin' placeholder="endTime..." value='' ng-model="dateEnd">
</label>

JS：

function DatePicker(beginSelector,endSelector){
    $(beginSelector).datetimepicker(
        {
            language:  'zh-CN', // 语言选择中文
            autoclose: true,
            startView: 'month', // 进来是月
            minView: 'hour',// 可以看到小时
            minuteStep:1, //分钟间隔为1分
            format: 'yyyy-mm-dd hh:ii:ss',// 年月日时分秒
            clearBtn:false,
            todayBtn:true,
            endDate:new Date()
        }).on('changeDate', function(ev){
        if(ev.date){
            $(endSelector).datetimepicker('setStartDate', new Date(ev.date.valueOf()))
        }else{
            $(endSelector).datetimepicker('setStartDate',null);
        }
    })

    $(endSelector).datetimepicker(
        {
            language:  "zh-CN",
            autoclose: true,
            minView: "hour",
            minuteStep:1,
            startView:'month',
            format: "yyyy-mm-dd hh:ii:ss",
            clearBtn:true,
            todayBtn:false,
            endDate:new Date()
        }).on('changeDate', function(ev){
        if(ev.date){
            $(beginSelector).datetimepicker('setEndDate', new Date(ev.date.valueOf()))
        }else{
            $(beginSelector).datetimepicker('setEndDate',new Date());
        }

    })
}
DatePicker("#dateBegin","#dateEnd");

效果图