javascript - 使用日期时间选择器选择日期/时间时触发事件

Question

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

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

我收到这个错误

TypeError: option onClose is not recognized!

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

时

$('#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>