使用bootstrap-datepicker检测到所选日期的更改 [英] Detect change to selected date with bootstrap-datepicker

问题描述

我有一个输入元素，附有使用引导日期戳创建的附加日期戳。

I have an input element with an attached datepicker created using bootstrap-datepicker.

<div class="well">
  <div class="input-append date" id="dp3" data-date="2012-01-02" data-date-format="yyyy-mm-dd">
    <input type="text" id="date-daily">
    <span class="add-on"><i class="icon-th"></i></span>    
  </div>
</div>

<script language="JavaScript" type="text/javascript">
$(document).ready(function() {
  $('#dp3').datepicker();
  $('#date-daily').val('0000-00-00');
  $('#date-daily').change(function () {
    console.log($('#date-daily').val());
  });
});
</script>

当用户通过直接键入输入元素来更改日期时，我可以使用input元素的onChange事件，如上所示。但是，当用户从datepicker更改日期（即通过单击日历上的日期）时，不会调用onChange处理程序。

When the user changes the date by typing directly into the input element, I can get the value with the input element's onChange event, as shown above. But when the user changes the date from datepicker (i.e. by clicking a date on the calendar), the onChange handler is not called.

如何检测所选的日期是通过datepicker进行的，而不是通过键入输入元素？

How can I detect changes to the selected date that are made via the datepicker, rather than by typing into the input element?

推荐答案

所有其他答案都与 jQuery UI datepicker ，但问题是关于 bootstrap-datepicker 。

All others answers are related to jQuery UI datepicker, but the question is about bootstrap-datepicker.

您可以使用 changeDate 事件触发相关输入上的更改事件，然后处理从 onChange 处理程序更改日期的两种方法：

You can use the on changeDate event to trigger a change event on the related input, and then handle both ways of changing the date from the onChange handler:

changeDate

changeDate

日期更改时触发。

示例：

$('#dp3').datepicker().on('changeDate', function (ev) {
    $('#date-daily').change();
});
$('#date-daily').val('0000-00-00');
$('#date-daily').change(function () {
    console.log($('#date-daily').val());
});

这是一个工作小提琴： http://jsfiddle.net/IrvinDominin/cUhQJ/

Here is a working fiddle: http://jsfiddle.net/IrvinDominin/cUhQJ/

这篇关于使用bootstrap-datepicker检测到所选日期的更改的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！