How regularities restrict input Mask text

want to use input to enter the time (format 00:00). If you fill in 8:45, fill in 0 before, and fill in automatically in the middle:, now there are more than one after: the front does not automatically fill 0

<div class="layui-inline">
                <label class="layui-form-label"></label>
                <div class="layui-input-inline layui-form">
                    <input type="text" maxlength="5" onkeyup="regVal(event)"  autocomplete="off" class="layui-input">
                </div>
            </div>

function regVal(ev) {
        if (ev.altKey || ev.ctrlKey || ev.shiftKey || ev.metaKey ) return;
        var str = ev.target.value.replace(/[^\d]/g,"").replace(/(.{2,2})/g, "$1:");
        if (str === ev.target.value) return;
        ev.target.value = str;
    }

May.17,2022
Menu