如何在 JS 函数 onchange 事件中获取 Bootstrap Datepicker 的值？

Question

在引导程序日期选择器中选择日期后，我尝试在 javascript 函数中获取日期值，但我不能这样做。

日期选择器工作并在输入字段中显示日期，但我不能使用这个值。 （例如，我希望当我选择一个日期时，我会收到带有所选日期的弹出警报）

这是日期选择器：

<div class="form-group">
    <label class="control-label" for="date">THE Date</label>
    <div class="form-group">
        <div class='input-group date' >
            <input class="form-control " id="date_id" name="date" placeholder="DD/MM/YYYY" type="text" onchange="DateFunction()"  />
            <div class="input-group-addon">
                <span class="glyphicon glyphicon-th"></span>
            </div>
        </div>
    </div>
</div>

JavaScript：

$(document).ready(function () {
    var date_input = $('input[name="date"]'); 

    var container = $('.bootstrap-iso form').length > 0 ? $('.bootstrap-iso form').parent() : "body";
    var options = {
        format: 'dd/mm/yyyy',
        container: container,
        todayHighlight: true,
        autoclose: true,
    };
    date_input.datepicker(options);
})

function DateFunction() {

    var x = document.getElementById("date_id");
    alert(x.Value);

}

------------编辑：--------强>

我改用这个功能。我需要如何以及在哪里添加行来获取我的日期值？日期是工作并显示在输入中

html:

<div class="container">
  <div class="col-xs-12">
    <input name="datetimepicker" id="Date_id" />
  </div>
</div>

js:

  $(function () {
    $('input[name="datetimepicker"]').datetimepicker({
        format: 'DD/MM/YYYY',

    });

});

Answer 1

有关日期选择器事件的文档，请参阅 https://bootstrap-datepicker.readthedocs.io/en/latest/events.html。

总之

date_input.datepicker(options);
date_input.on('changeDate', function(e){
   // e.date holds the new date (e.dates if it is multidate picker)
   console.log(e.date); // log actual Date object to handle as you want
   console.log(this.value); // log the formatted value of the input
});

https://codepen.io/anon/pen/KoZzpw 的示例