Question

我的表单中有3个元素需要日期/时间选择器。对于每个元素，我需要应用不同的默认时间。

如果我在config / format选项中设置了默认时间，那么选择时间的功能将从datepicker中消失。如果我在选项中输入有效的时间格式，那么我可以使用时间戳，但选择新的日期也会将元素的值设置为当前时间：

$(function () {
        $('#datetimepicker_earliest').datetimepicker({
            locale: 'en-gb',
            format: 'DD/MM/YYYY 16:00',
            extraFormats: ['DD/MM/YYYY H:MM']
        });
    });

我想要实现的是如果没有选择时间，则使用默认时间。如果使用时间选择器选择新时间，则使用此时间。这可能吗？

Answer 1

您可以使用dp.change事件设置用户选择一天的自定义时间。

活动会收到date和oldDate作为参数，您可以使用片刻设置器（hour，minute）来根据您的需要更新选择器时间。

您可以使用date函数更改datetimepicker的日期。

这是一个工作示例：

$('#datetimepicker_earliest').datetimepicker({
  locale: 'en-gb',
  format: 'DD/MM/YYYY HH:mm',
  extraFormats: ['DD/MM/YYYY H:mm']
}).on('dp.change', function(e){
  if( !e.oldDate || !e.date.isSame(e.oldDate, 'day')){
    e.date.hour(16).minute(0);
    $(this).data("DateTimePicker").date(e.date);
  }
});

<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" id="datetimepicker_earliest">
  <input type="text" class="form-control" />
  <span class="input-group-addon">
    <span class="glyphicon glyphicon-calendar"></span>
  </span>
</div>

使用默认时间的TimePicker（预定义时间禁用时间戳）

1 个答案: