0

我有一个字段可以设置日期。该字段可以有一个格式为 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 代码段将日期设为 20.03.1023。我不知道为什么。我不太了解javascript,但我猜onSelect 参数只是一种匿名回调函数,只有在用户单击日期选择器按钮时才会调用。

请问有什么建议吗?

谢谢,吉克拉

编辑:

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

那可能吗?

4

1 回答 1

0

最简单的解决方案是在 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/

于 2015-10-23T12:46:47.643 回答