twitter-bootstrap - 如何使用 dp.change 事件自动关闭 Bootstrap 的 datetimepicker？

Question

如何仅在选择日期时自动关闭日期时间选择器。我正在使用 dp.change 事件，但即使在更改时间时它也会关闭 datetimepicker。

$('.datetimepicker').each(function () {
    $(this).on('dp.change', function (ev) {

       $(this).data('DateTimePicker').hide();

    });
});

时间选择器的类名是什么？如果我获取类并告诉 datetimepicker 在类名等于时间选择器的类名时不要关闭怎么办？

日期时间选择器的最新版本是什么？

1 是这样的: http://eonasdan.github.io/bootstrap-datetimepicker/

第二个是带有自动关闭属性的。

http://www.malot.fr/bootstrap-datetimepicker/

谢谢。

Answer 1

使用 eonasdan datetimepicker您可以检查新选择的日期是否与之前选择的日期相同(使用 moment isSame )。

注意 dp.change接收 oldDate 和 date 作为参数。

这里是一个工作示例:

$('.datetimepicker').datetimepicker().on('dp.change', function(e){
  if( !e.oldDate || !e.date.isSame(e.oldDate, 'day')){
    $(this).data('DateTimePicker').hide();
  }
});

<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.css" rel="stylesheet"/>
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.42/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.15.1/moment.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/locale/en-gb.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.42/js/bootstrap-datetimepicker.min.js"></script>

<div class="input-group date datetimepicker">
  <input type="text" class="form-control" />
  <span class="input-group-addon">
    <span class="glyphicon glyphicon-calendar"></span>
  </span>
</div>