bootstrap-datepicker实现日期input readonly 标签中选择时间功能

引用datepicker css,js,zh-CH文件

ps: 都是基于bootstrap，所以得先引入bootstrap文件才可以使用

　　 <link href="https://cdn.bootcss.com/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker.min.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/bootstrap-datepicker/1.8.0/js/bootstrap-datepicker.js"></script> 
    <script src="https://cdn.bootcss.com/bootstrap-datepicker/1.8.0/locales/bootstrap-datepicker.zh-CN.min.js"></script>   // 日期显示会用到中文
    

 

js

<input readonly name="start-time" class="form-control choice-start-time" type="text" placeholder="开始时间">
<span>-</span>
<input readonly name="end-time" class="form-control choice-end-time" type="text" placeholder="结束时间">

// 选择时间事件
$(function () {
    var today = new Date();
    var todayStr = today.getFullYear() + '/' + (today.getMonth()+1)
    + '/' + today.getDate();
    var option = {
        'format': 'yyyy/mm/dd',
        'autoclose': true,
        'startDate': '2018/7/10',
        'endDate': todayStr,
        'language': 'zh-CN',
        'todayBtn': 'linked', // 显示一个选择今日的按钮
        'todayHighlight': true, // 当前日期是否高亮
        'showButtonPanel': false, // 是否展示按钮
        'clearBtn': true

        // 'startDate': '-3d'
    };
    $('input[name="start-time"]').datepicker(option);
    $('input[name="end-time"]').datepicker(option);
});