Bootstrap中datetimepicker日期控件1899年问题解决

@加粗样式TOC

Bootstrap中datetimepicker日期控件1899年问题解决
Bootstrap中datetimepicker日期控件1899年问题解决
　　最近在开发项目的过程中，遇到一个很尴尬的问题。我们项目一直采用的是angular+bootstrap，日期控件用的是bootstrap中的datetimepicker，这个日期控件存在一个bug，当用户输入日期时，日期控件会自动跳到1899年，这个用户体验特别不好，一不小心就可能点错了。因为我们的项目中涉及的日期非常多，所以领导强烈要求我们前端解决这个问题，并且需要支持yyyy-MM-dd、yyyy/MM/dd、yyyy.MM.dd、yyyyMMdd等四种格式的兼容。作为前端中的一员，我不遗余力去从网上找答案，在百度上找了好几天，没有结果。就在最后，我忽然想到了github，在这上面我找到了我想要的答案。下面和大家分享一下。

一、存在问题
　　　　当用户输入日期时，控件会自动跳到1899年。至于为什么是1899年，老大说，1899是控件支持的最小日期。我还以为是1899年诞生的（可笑）。
二、解决方法
　　1、修改bootstrap-datetimepicker源码
　　　　将控件默认的1899年改为默认当前日期。
　　　　2、支持的多种格式
　　　　其实datetimepicker默认支持yyyy-MM-dd、yyyy/MM/dd、yyyy.MM.dd三种日期格式，另外一种yyyyMMdd需要我们自己在代码中实现。

我实现的方法是当用户输完日期后，用正则表达式，将八位数转换为yyyy-MM-dd日期格式。

1 var regex = /^(\d{4})(\d{2})(\d{2})$/;
2 return date.replace(regex, "$1-$2-$3");

3、需要注意的问题
　　datetimepicker属性forceParse， Boolean. 默认值: true

当选择器关闭的时候，是否强制解析输入框中的值。也就是说，当用户在输入框中输入了不正确的日期，选择器将会尽量解析输入的值，并将解析后的正确值按照给定的格式format设置到输入框中。这个属性就默认支持yyyy-MM-dd、yyyy/MM/dd、yyyy.MM.dd三种日期格式转换为自定义的格式。

Bootstrap中datetimepicker日期控件1899年问题解决相关推荐

datetimepicker 时间控件 1899年问题以及解决方法
datetimepicker 时间控件 1899年问题以及解决方法参考文章: (1)datetimepicker 时间控件 1899年问题以及解决方法 (2)https://www.cnblogs. ...
bootstrap中使用日历控件
在bootstrap中使用日历控件可以参照以下资料: http://www.bootcss.com/p/bootstrap-datetimepicker/index.htm 以下是参照此资料自己做的一 ...
ASP.NET中 Calendar(日期控件)的使用
ylbtech-ASP.NET-Control-Basic:Calendar(日期控件)的使用 ASP.NET中 Calendar(日期控件)的使用. 1.A,运行效果返回顶部 Calendar(日期 ...
app中jeDate日期控件的使用
如果是knockout监听对象那么可封装 define(function (require) { 'use strict'; var lib = { ko: requi ...
Android中的日期控件DatePicker和DatePickerDialog
今天早上我写一个程序,需要用到在一个对话框中去显示一个日期匹配器. 当时,我就想,这个还不简单,不就是写一个DatePicker的布局文件,然后再把它部署到AlertDialog中不就好了吗? 当我真 ...
struts 2.x版本 datetimepicker日期控件的使用
In Struts 2, the dojo ajax tag "<sx:datetimepicker>" will render a text box and appe ...
js中的日期控件My97 DatePicker
使用WdatePicker插件来渲染日期类型的页面. 以下代码用到的属性有: isShowClear是否显示清空按钮 skin皮肤的样式 readOnly是否只读 maxDate:最大的选择时间 &l ...
bootstrap 模态框日期控件datepicker被遮住问题的解决
找到日期输入框,并将 .class 属性的 z-index 改大在JSP页添加样式: 这样就OK了: 转载于:https://www.cnblogs.com/telwanggs/p/7151338 ...
Android日期控件
(请先认真读一下前两段,谢谢) 最近做了一个电商的Android原生项目,其中有一个酒店预订的功能,要实现一个日期控件,基本就是入住时间,离店时间,日期控件需要连续展示一年或者几年的按月份显示的连续视 ...

Bootstrap中datetimepicker日期控件1899年问题解决

Bootstrap中datetimepicker日期控件1899年问题解决相关推荐

最新文章

热门文章