在同一输入字段中同时格式化日期和时间

Question

I have an input field that allows the user to enter both the time and date. While the user types, I would like to format on keyup. Would you guys by chance have a solution for this? Here is my current code:

.on('keyup', '.type-date', function(e) {
    $(this).attr('maxlength', '10');
    var value = $(this).val();
    var key = e.keyCode;
    if (!(key >= 48 && key <= 57 && 8)) {
        $(this).val($(this).val().substring(0, $(this).val().length));
    }
    if (key == 8) {

    } else if (value.length == 2 || value.length == 5) {
        $(this).val($(this).val() + '/');
    }
    $('.type-date').attr('value', value);
});

Answer 1

To achieve expected result, use below option

1. Check validity of entered date

var error = ((typedate.slice(0,2) > 12) || (typedate.slice(2,4) > 31) || (typedate.slice(4,6) > 60) || (typedate.slice(6,8) > 24)) ? true : false

2. If date is valid , Split entered date in format- MMDDYYHHSS

var date = $(this).val().split('');

3. Add slashes ,colon , AM/PM to the splitted date using splice

 $('.type-date').on('keyup', function(e) { $(this).attr('maxlength', '10'); var typedate = $(this).val(); var error = ((typedate.slice(0,2) > 12) || (typedate.slice(2,4) > 31) || (typedate.slice(4,6) > 60) || (typedate.slice(6,8) > 24)) ? true : false if(!error && typedate.length === 10){ var date = $(this).val().split(''); date.splice(2, 0, "/"); date.splice(5, 0, "/20"); date.splice(8, 0, " "); date.splice(11, 0, ":"); typedate.slice(6, 8) > 12 ? date.splice(14, 0, " PM") : date.splice(14, 0, " AM"); var time = typedate.slice(6, 8) > 12 ? typedate.slice(6, 8) - 12 : typedate.slice(6, 8); time = time < 10 ? "0" + time : time; date.splice(9, 2, ...time.toString().split("")); $('.result').text(date.join('')); }else{ $('.result').text('Invalid Date'); } }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input type="text" class="type-date"> Date: <span class="result"></span> 

codepen - https://codepen.io/nagasai/pen/GzLOKG?editors=1010

Input : 1222192311

Output: 12/11/2019 11:11 PM