Chrome限定のお話。
Chromeの日付入力フォームの動作が解せません。
以下のHTMLを見て下さい。
<!DOCTYPE html> <html> <body> <input type="date" value="2013-01-01" oninput="console.info(this.value);" /> </body> </html>
さて、フォームに2013-02-31と入力するとコンソールに何と表示されるでしょうか?
わかります?
答えは
2013-01-01
です。
要するに、不正な日付を入力するとフォームの値がvalue属性の値になってしまいます。
ぶっちゃけ、困るんですけどコレ…。
ワークアラウンド
とりあえずこんな感じにしときました。
$(document).ready(function() { $("input[type='date'], input[type='datetime'], input[type='datetime-local']").each(function() { var $this = $(this); $this.val($this.val() || $this.attr('value')).attr('value', null); }); });
これで、不正な日付が入力されるとフォームの値は空文字になります。
残念ながら、2013-02-31のような『不正ではあるが、とにかく入力された値』を取ることは出来ないようです。