使用日期时间选择器选择 date/time 时触发事件

Question

我目前在我的代码中使用 this datetimepicker（无图标（仅输入字段）），我需要在选择日期时间后触发一个函数。我尝试使用几个 jQuery 函数，但我会得到不同的错误，这里是我使用的：

$('#datetimepicker4').datetimepicker({
    onClose: function (dateText, inst) {
        alert("date chosen");                                              
    }
});

我收到这个错误

TypeError: option onClose is not recognized!

和 onSelect 的类似一个，当我使用 datepicker instead

$('#datetimepicker4').datepicker({
    onClose: function (dateText, inst) {
        alert("date chosen");                                              
    }
});

我收到这个错误：

TypeError: $(...).datepicker is not a function

ps: 我正在使用 jQuery 1.11.3 和运行 firefox 的代码。

编辑：问题已通过 dp.change

解决

Answer 1

Eonasdan datetimepicker 没有 onClose 选项，您可以为 dp.change 事件添加处理程序：

Fired when the date is changed.

Parameters:

e = {
  date, //date the picker changed to. Type: moment object (clone)
  oldDate //previous date. Type: moment object (clone) or false in the event of a null
}

这里是一个活生生的例子：

$('#datetimepicker4').datetimepicker()
  .on('dp.change', function(e){
    if(e.date){
      console.log('Date chosen: ' + e.date.format() );
    }
  });

<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet"/>
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.css" rel="stylesheet"/>

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>


<div class="container">
  <div class="row">
    <div class='col-sm-6'>
      <input type='text' class="form-control" id='datetimepicker4' />
    </div>
  </div>
</div>

使用日期时间选择器选择 date/time 时触发事件

Trigger an event when selecting a date/time with datetime-picker

javascript

jquery

datepicker

datetimepicker

eonasdan-datetimepicker