Bootstrap中datetimepicker日期控件1899年問題解決

　Bootstrap中datetimepicker日期控件1899年問題解決

　　最近在開發項目的過程當中，遇到一個很尷尬的問題。咱們項目一直採用的是angular+bootstrap，日期控件用的是bootstrap中的datetimepicker，這個日期控件存在一個bug，當用戶輸入日期時，日期控件會自動跳到1899年，這個用戶體驗特別很差，一不當心就可能點錯了。由於咱們的項目中涉及的日期很是多，因此領導強烈要求咱們前端解決這個問題，而且須要支持yyyy-MM-dd、yyyy/MM/dd、yyyy.MM.dd、yyyyMMdd等四種格式的兼容。做爲前端中的一員，我竭盡全力去從網上找答案，在百度上找了好幾天，沒有結果。就在最後，我突然想到了github，在這上面我找到了我想要的答案。下面和你們分享一下。

　　1、存在問題

　　　　當用戶輸入日期時，控件會自動跳到1899年。至於爲何是1899年，老大說，1899是控件支持的最小日期。我還覺得是1899年誕生的（好笑）。

　　

　　2、解決方法

　　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");

 

　　三、須要注意的問題

　　datetimepicker屬性forceParse，   Boolean. 默認值: true

　　當選擇器關閉的時候，是否強制解析輸入框中的值。也就是說，當用戶在輸入框中輸入了不正確的日期，選擇器將會盡可能解析輸入的值，並將解析後的正確值按照給定的格式format設置到輸入框中。這個屬性就默認支持yyyy-MM-dd、yyyy/MM/dd、yyyy.MM.dd三種日期格式轉換爲自定義的格式。

 

　　通過這個問題，我忽然發現，每次解決問題，我找答案的途徑都太單一，每次都是當我快要放棄的時候，纔會想到其餘的途徑。致本身一句話，沒有什麼是github上沒有的，時刻把github放內心。