jQuery datetimepicker插件问题：自定义格式下无法读取初始日期时间

嘿，我遇到过类似的坑，这就帮你捋清楚怎么解决！

问题根源 #

你现在的问题是：把日期格式改成d/m/Y H:mm后，输入框明明有正确格式的初始值，点进去却显示当前时间；试了方法还出现日期不高亮、分钟显示成"i"的怪事。

其实原因有俩：

1. 这个插件初始化时，光设format不够，它默认会用默认格式解析输入框的初始值，不会自动适配你自定义的格式；
2. 你格式字符串写错啦！这个插件的分钟占位符是i不是mm，用错了就会出现渲染异常。

靠谱解决方案 #

方法一：明确指定日期和时间的解析规则 #

初始化的时候，除了format，再加上formatDate和formatTime，告诉插件怎么解析日期和时间部分：

$('.datetimepicker').datetimepicker({
  format: 'd/m/Y H:i', // 注意分钟用i，不是mm！
  formatDate: 'd/m/Y', // 日期部分的解析/显示格式
  formatTime: 'H:i',   // 时间部分的解析/显示格式
  step: 15 // 可选：比如设置分钟按15步长跳，按需添加
});

方法二：手动给插件传入初始值 #

如果输入框的初始值格式已经完全符合你要的样式，也可以在初始化时把值直接传给插件，强制它用你的格式解析：

$('.datetimepicker').each(function() {
  const $input = $(this);
  $input.datetimepicker({
    format: 'd/m/Y H:i',
    value: $input.val() // 把输入框已有的值传给插件
  });
});

修复那些奇怪的异常 #

你之前碰到的分钟显示"i"，就是因为格式字符串用错了——把H:mm改成H:i就好啦，这个插件的格式规则和有些插件不一样，得按它的文档来。

至于日期不高亮，那是因为插件没正确解析初始日期，用上面的方法明确指定格式后，插件就能认出输入框里的日期，自然就会在日历里高亮对应日期了。

最后检查下 #

确保输入框的初始值和你设置的格式完全匹配，比如21/05/2020 17:00要对应d/m/Y H:i：

• 两位数日期对应d，两位数月份对应m，四位数年份对应Y
• 24小时制的两位数小时对应H，两位数分钟对应i

内容的提问来源于stack exchange，提问作者Max Williams