jQuery UI datetimepicker 中的自定义分隔符添加

Question

我使用the datetimepicker add on for the jQuery UI datepicker（基于jQuery UI datepicker）在我的网页上实现带有日历小部件的输入字段。根据文档（参见上面链接页面上的Options 选项卡），有一个可选参数separator 可以指定介于日期和时间值之间的字符，默认为空格。

但是，当我使用不包含空格的自定义分隔符时，例如 T（在 ISO 8601 时间字符串中，看起来像 2016-01-15T15:13:20Z），我可以在小部件中选择一个时间并显示它正确，但是当我再次单击输入字段以选择下一个时，浏览器控制台给了我：

Error parsing the date string: Extra/unparsed characters found in date: T12:00:00
date string = 2016-01-13T12:00:00
date format = yy-mm-dd

是我误解了参数还是有其他方法可以实现我的自定义日期时间格式？

作为记录，我在 jQuery 2.2.0、jQuery UI 1.11.4 和 jQuery UI datetimepicker add on 1.6.1 上进行了尝试。

请参阅下面的代码和尝试自己的 sn-p。

HTML 和 JS：

// Without custom separator
$("#datetime_input_1").datetimepicker({dateFormat: "yy-mm-dd",
                                       timeFormat: "hh:mm:ss"
                                      });

// With custom separator
$("#datetime_input_2").datetimepicker({dateFormat: "yy-mm-dd",
                                       timeFormat: "hh:mm:ss",
                                       separator: "T"
                                      });

<!-- Imports -->
<script src="https://getfirebug.com/firebug-lite-debug.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link href="https://code.jquery.com/ui/1.11.4/themes/south-street/jquery-ui.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-timepicker-addon/1.6.1/jquery-ui-timepicker-addon.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-timepicker-addon/1.6.1/jquery-ui-timepicker-addon.css" rel="stylesheet"/>


<!-- Input forms -->
<input type="text" class="form-control" id="datetime_input_1" >
<br><br>
<input type="text" class="form-control" id="datetime_input_2" >

Answer 1

尝试使用

$("#datetime_input_2").datetimepicker({dateFormat: "yy-mm-dd",
                                   timeFormat: "hh:mm:ss",
                                   separator: ' T '
                                  });

或

$("#datetime_input_2").datetimepicker({dateFormat: "yy-mm-dd",
                                   timeFormat: "hh:mm:ss",
                                   separator: " T "
                                  });

代替你的

$("#datetime_input_2").datetimepicker({dateFormat: "yy-mm-dd",
                                   timeFormat: "hh:mm:ss",
                                   separator: "T"
                                  });

它应该会给你带来等待的结果。这意味着例如2016-01-22 T 12:25:25。这应该可以正常运行。

我阅读了该插件的页面，并在 Examples 部分找到了这个

var ex13 = $('#utility_example_1');

ex13.datetimepicker({
    timeFormat: 'hh:mm tt z',
    separator: ' @ ',
    showTimezone: true
});

但我仍然不能保证字母 T 会被接受，即使它两边各有一个空格。

编辑：

我发现（在插件代码中）这个

/*
    * override parseDate() because UI 1.8.14 throws an error about "Extra characters"
    * An option in datapicker to ignore extra format characters would be nicer.
    */

它似乎运行不正确。