Question

以下是使用Bootstrap datetimepicker创建日历的代码：

$('#datetimepicker12').datetimepicker({
    inline: true,
    format: 'MM/dd/yyyy',
    minDate: new Date(moment(new Date()).add(0, 'days').toDate()),
    maxDate: new Date(moment(new Date()).add(7, 'days').toDate()),
});

现在我想将日历的默认日期设置为我的自定义日期，其格式如下所示＆＃39; 2017-03-30＆＃39;

如何将其转换为与之前设置的datetimepicker格式相同的格式？

Answer 1

此处记录了有效格式：

https://eonasdan.github.io/bootstrap-datetimepicker/Options/#format

从那里你可以阅读：

见momentjs＆＃39;有效格式的文档。格式还规定了显示哪些组件，例如MM / dd / YYYY不会显示时间选择器。

http://momentjs.com/docs/#/displaying/format/

因此，对于您的具体情况，它将是：

format: 'MM/DD/YYYY'  //(all uppercase)

并设置您需要使用的默认值：

defaultDate:

defaultDate的文档是here

Answer 2

Bootstrap datetimepicker使用momentjs来管理日期，因此：

您的new Date(...)和toDate()选项中不需要minDate和maxDate。
format选项应符合moment tokens，在您的情况下，将其更改为大写 MM/DD/YYYY。

选择器有一个defaultDate选项，您可以使用它将2017-03-30设置为默认日期，您只需parse使用它（moment('2017-03-30')就足够了因为您输入的是受支持的ISO 8601格式。）

如果您必须默认使用当前日期，请注意datimepicker有useCurrent选项。

这是一个工作示例：

＆＃13;

$('#datetimepicker12').datetimepicker({
  inline: true,
  format: 'MM/DD/YYYY',
  minDate: moment().startOf('day'),
  maxDate: moment().add(7, 'days').endOf('day'),
  defaultDate: moment('2017-03-30')
});

＆＃13;

<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.37/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.37/js/bootstrap-datetimepicker.min.js"></script>

<div class="form-group">
  <div class="row">
    <div class="col-md-8">
      <div id="datetimepicker12"></div>
    </div>
  </div>
</div>

＆＃13;

在2017-30-17之后，该代码段将无效，默认日期将不会包含在minDate和maxDate之间。

Answer 3

$.datepicker.setDefaults({
    dateFormat: 'yy-mm-dd'
});

如何设置格式的默认日期＆＃39; MM / dd / yyyy＆＃39;

3 个答案: