如何从bootstrap-datetime-picker插件中获取日期对象？

Question

我正在尝试利用tempusdominus-datetimepicker-3在我的html表单中创建一个日期时间选择器.

但是,我需要能够从中获取所选日期.该插件有一个名为date的选项,根据该文档应该返回一个时刻对象或null.以下是该文档对此选项的说明

返回组件的模型当前日期,moment对象或未null设置

但是,我正在努力访问该date选项.

也来自doc

注意所有选项都可通过data属性访问,例如 $('#datetimepicker').datetimepicker(OPTION, ARGUMENT)

所以我尝试了以下访问日期选项.

from = $('#datetimepicker').datetimepicker('date');
from = $('#datetimepicker').datetimepicker('data', 'date');
from = $('#datetimepicker').datetimepicker('data').date;
from = $('#datetimepicker').datetimepicker(function(e){
    return e.date;
});

但是以上都没有返回对象.如何访问日期对象？

我认为一个不错的插件,这样一个将有更多的选择可读性像getDate(),setDate(date),getFomat()和setFormat(...)等; 或事件的例子,这应该消除像这样的问题,但不幸的是它没有.

Answer 1

以下是访问事件的正确代码:

$(function() {
   $('#datetimepicker').datetimepicker();
   $('#datetimepicker').on("change.datetimepicker", function (e) {
      console.log(e.date);
   });
 });

您也可以使用此获取日期:

var date = $('#datetimepicker').datetimepicker('viewDate')

操纵日期的完整小提琴:https://jsfiddle.net/10xzksm0/2/

Answer 2

如果有人遇到和我一样的麻烦（使用 bootstrap v4 https://tempusdominus.github.io/bootstrap-4/），并且想要选择器关闭时的日期，这里是代码：

$(function () {
    $('#datetimepicker').datetimepicker();
    $('#datetimepicker').on("datetimepicker.hide", function (e) {
        console.log(moment(e.date).format('YYYY-MM-DD HH:mm'));
    });
});

请注意，在这种情况下，datetimepicker之前谈到hide，这是不同的change到来之前datetimepicker。使用hide.datetimepicker将不起作用。