Question

我正在使用bootstrap-datetimepicker。我有一个按钮，可以在datetimepicer div上设置日期和时间，它在输入中正确显示，但是当我将日历放下时，它会显示当前月/年，而不是输入中的日期。但是，如果我关闭日历并重新打开它，则会显示正确的日期。当我第一次放下日历并返回一个月时，正在设置日历值，突出显示正确的日期。如何以编程方式设置日历显示日期？

谢谢。

<html>
<head>
    <script src="Scripts/Libs/jquery-3.1.1.min.js"></script>
    <script src="Scripts/Libs/moment.js"></script>
    <script src="Scripts/Libs/bootstrap.min.js"></script>
    <script src="Scripts/Libs/bootstrap-datetimepicker.js"></script>
    <link href="Content/bootstrap.css" rel="stylesheet" />
    <link href="Content/bootstrap-datetimepicker.min.css" rel="stylesheet" />
<meta charset="utf-8" />
    <title></title>
</head>
<body>
    <button id="btnSetDate">Set Date</button>
    <div class="row">
        <div class='col-sm-6'>
            <div class="form-group">
                <div class="input-group date" id="dp1">
                    <input type="text" class="form-control" id="testDate" />
                    <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
        </div>
    </div>
</body>
</html>

<script src="Scripts/CalendarTest.js"></script>

我的脚本是

$(document).ready(function () {

$('#dp1').datetimepicker(
    { format: 'YYYY/MM/DD hh:mm A' }
).on('dp.change', function (ev) {
    var $div = $(this);
    var date = $div.data('date');
    $div.data("DateTimePicker").defaultDate(date);
    $div.datetimepicker('hide');
});

$('#btnSetDate').on('click', function () {
    var dateString = '2017/12/21 5:16 AM';    
    var date = new Date(dateString);
    var value = moment(date).format('YYYY/MM/DD hh:mm A');
    var $div = $('#dp1');
    $div.data("DateTimePicker").date(value);
});
});

bootstrap datetimepicker在打开时不显示日期

0 个答案: