如何使用引導日期選擇器自動格式化日期

Question

鍵入后如何使datepicker自動格式化日期。 例如。 輸入02122018，輸入的日期將在輸入或選項卡上顯示02 / Dec / 2018。

以下引導日期選擇器沙箱將默認為今天的日期，並具有我想要的格式。 但不是我輸入日期。 https://uxsolutions.github.io/bootstrap-datepicker/?#sandbox

Answer 1

您實際上並不需要Bootstrap datepicker。 您可以讓輸入延遲鍵盤輸入，然后查看輸入並評估是否准備好轉換（也就是足夠的數字），然后使用某種方式解釋格式並顯示轉換后的結果。

有關詳細信息，請查看一下momentjs 。

您的輸入

<input id="dateInput" type="text">

延遲功能

var delay = (function(){
    var timer = 0;
    return function(callback, ms){
        clearTimeout (timer);
        timer = setTimeout(callback, ms);
    };
})();

用法

jQuery(document).ready(function($) {
    $('#dateInput').keyup(function() {
        const dateString = $(this).val();
        delay(function(){
            // Use momentjs to format, for example:
            moment(dateString, "DDMMYYYY").format("MMM Do YY");
        }, 1000 );
    });
});

祝好運！