logo

imaskjsで時間を範囲入力

https://imask.js.org/

HTML

<input id="input" type="text"> <div id="raw"></div>

Javascript

const mask = new IMask(document.getElementById('input'), { mask: 'HH:mm 〜 HH:mm', lazy: false, blocks: { HH: { mask: IMask.MaskedRange, from: 0, to: 23 }, mm: { mask: IMask.MaskedRange, from: 0, to: 59 } } }); mask.on("accept", function () { document.getElementById('raw').innerHTML = mask.unmaskedValue; });