本地化 Bootstrap 日期时间选择器以支持多种语言，但选择后返回英文日期时间值？

Question

我正在开发的应用程序支持多种语言的本地化，因此当我在应用程序中初始化 datetimepicker 时，我会传入当前使用的语言，如下所示：

datetimepicker({
    locale: languageObj.language,
    format: 'DD MMM YYYY',
    extraFormats: ['YYYY-MM-DD'],
    icons: {
        previous: 'btn-chevron-prev',
        next: 'btn-chevron-next',
    }
});

但是，当我在用户选择日期后获得此 datetimepicker 输入的 .val() 时，该值也作为翻译后的日期时间返回。我希望做的是向用户可视化日期时间选择器的翻译版本，但是当我获得日期时间选择器的值时，返回所选日期的英文默认翻译。这可能吗？

Answer 1

TL;DR，给我看看代码

Working JSFiddle 展示了 2 种不同的方法。

说明

方法#1

文档描述a date option：

返回组件的模型当前日期，一个时刻对象，如果未设置，则返回 null。

在同一页面的顶部有一条关于如何使用这些选项的说明：

注意所有选项都通过数据属性访问，例如$('#datetimepicker').data("DateTimePicker").OPTION()

所以，无论您在哪里使用.val()，例如：

// Localised value, not what you want
var selectedDate = $('#datetimepicker').val(); 

改为使用date() 选项。记住date() 返回一个时刻对象，所以you can format it 随你喜欢，例如YYYY-MM-DD：

var selectedDate = $('#datetimepicker').data("DateTimePicker").date().format('YYYY-MM-DD');

方法 #2

文档描述the dp.change event：

日期更改时触发 ...

参数：

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
}

因此，每当用户选择日期时，我们都可以使用该事件来获取他们选择的日期。

$('#datetimepicker').on('dp.change', function(e) {
    // We can now access e.date and e.oldDate, both moment objects
    var selectedDate = e.date.format('YYYY-MM-DD');

    // ... do something with selectedDate ...
});

您可以在the JSFiddle 中看到这两种方法的实际效果，并带有解释性 cmets。