BootStrap3中日期选择器的使用

需要用到的css、js文件如下

版本截图如下：

引用示例：

    //CSS
    <link href="${path}/static/css/bootstrap.min.css" rel="stylesheet">
    <link href="${path}/static/css/bootstrap-datetimepicker.min.css" rel="stylesheet">

    //JS
    <%--jquery必须放在其他js文件之前--%>
    <script src="${path}/static/js/jquery.min.js"></script>
    <%--bootstrap日期选择器国际化包--%>
    <script src="${path}/static/js/moment-with-locales.min.js"></script>
    <script src="${path}/static/js/bootstrap.min.js"></script>
    <%--bootstrap日期选择器包--%>
    <script src="${path}/static/js/bootstrap-datetimepicker.min.js"></script>

//示例代码                    
<div class="form-group">
     <label class="col-sm-2 control-label">出版日期</label>
         <div class="col-sm-10">
               <input type="text" class="form-control" id="input_book_published"
                                   placeholder="book published">
         </div>
 </div>

js代码

//日期选择器
    $('#input_book_published').datetimepicker({
        //'dddd YYYY年MM月DD日 HH:mm:ss' 星期几 年月日 时分秒
        //YYYY年MM月DD日 HH:mm:ss' 年月日 时分秒
        format: 'YYYY-MM-DD',
        //国际化，这里指中文
        language: "zh-CN",
        //判断日期是否改变，改变就将日期选择框关闭
    }).on('dp.change', function (ev) {
        var newDateTime = ev.date ? ev.date.format('yyyy-MM-dd HH:mm:ss') : "";
        var oldDateTime = ev.oldDate ? ev.oldDate.format('yyyy-MM-dd HH:mm:ss') : "";
        if (newDateTime != oldDateTime) {
            $(this).data("DateTimePicker").hide();
        }
    });

成功截图