LoginSignup
1
0

input type="date", "time"の途中入力バリデーションをしてみる

Posted at

結論

input type="date", "time"を利用する際に、以下のプロパティを使うことで、入力値が正常かどうか(途中までしか入力されていないか)のチェックができます。
validity.badInput
https://developer.mozilla.org/ja/docs/Web/API/ValidityState/badInput

実装サンプル

var isBadInput = document.getElementById('').validity.badInput;
if (isBadInput) {
    console.log('正しい形式で入力してください。');
}

image.png

input type="date", "time"を使わずにdatepickerなどで実装したほうがリッチになるかと思いますが、シンプルな機能でよければこれで十分かと思います。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0