正在修改 Pikaday 默认值答案

【问题标题】：Pikaday default value is being modified正在修改 Pikaday 默认值
【发布时间】：2015-10-23 11:09:33
【问题描述】：

我有一个字段可以设置日期。该字段可以有一个格式为 YYYYMMDD 的默认值，并且它正在被转换为正确的格式 DD.MM.YYYY，这对于操作员来说是可以理解的。不要问我为什么，这是一个古老的系统，不，我无法重写它，因为它使用的是大后端。

我只需要在这些字段中添加简单的日期选择器。我选择了 Pikaday，它轻巧且简单，足以完成这项特定任务。我的典型用例如下所示：

<input type="text" id="datepicker" value="20150515" customType="date">
<img src="img/icon.gif" id="datepicker-button" />

<link rel="stylesheet" href="css/pikaday.css">
<link rel="stylesheet" href="css/site.css">
<script src="js/moment.min.js"></script>
<script src="js/pikaday.js"></script>
<script>
    var picker = new Pikaday(
    {
        field: document.getElementById('datepicker'),
        trigger: document.getElementById('datepicker-button'),
        firstDay: 1,
        yearRange: [1900,2020],
        onSelect: function() {
            var date = document.createTextNode(this.getMoment().format('DD.MM.YYYY') + ' ');
            document.getElementById('selected').appendChild(date);
        }
    });
    field.parentNode.insertBefore(picker.el, field.nextSibling);
</script>

原始代码是输入标签。剩下的就是我的新日期选择器功能。

现在，有什么问题。问题是默认值。假设默认值为 20151023。customType 属性应生成正确的日期 23.10.2015，但以下 Pikaday sn-p 生成的日期为 20.03.1023。我不知道为什么。我不太了解javascript，但我猜onSelect参数只是一种匿名回调函数，只有在用户单击日期选择器按钮时才会调用。

有什么建议吗？

谢谢，吉克拉

编辑：

似乎有一个不同的问题。如果有来自后端的任何值，它的值格式为 20151023。并且有一个具有某些功能的古老 javascript 文件，它解析值并创建正确的格式 23.10.2015。问题是我的 Pikaday 构造函数在那个古老的解析器之前被调用。即使我在 Pikaday 调用之前使用 jazZRo 的有希望的 sn-p 来修改值，那个古老的解析器也会因为它需要 YYYYMMDD 格式而吓坏了。所以，我需要在古老的解析器之后调用我的东西，或者禁止 Pikaday 构造函数中的 onSelect 回调函数在页面加载时不运行。

这可能吗？

【问题讨论】：

20151023 被 momentjs 解释为 20-15-1023 (DD-MM-YYYY) 并将月份值更正为 12 + 3 = 三月。我不知道您在哪里看到并创建了 a jsfiddle 您可以更新并粘贴评论中的链接以显示确切的问题吗？
jsfiddle.net/05fyr368/2
问题在于默认的日期格式。 Pikaday 的默认值是 YYYY-MM-DD，这很好，但我们使用的是 DD.MM.YYYY。

标签： javascript pikaday

【解决方案1】：

最简单的解决方案是在Pickaday使用之前使用momentjs转换输入的值：

(function() {
    var moment = window.moment(document.getElementById('datepicker').value, 'DDMMYYYY');
    document.getElementById('datepicker').value = moment.format('YYYY-MM-DD');
})();

见http://jsfiddle.net/05fyr368/3/

【讨论】：