ページを開いたときに、フォームの日付が今日になるようにする方法です。
実際のコード
<!DOCTYPE html>
<html lang="ja">
<input type="date" id="today">
<script type="text/javascript">
window.onload = function () {
var today = new Date();
today.setDate(today.getDate());
var yyyy = today.getFullYear();
var mm = ("0" + (today.getMonth() + 1)).slice(-2);
var dd = ("0" + today.getDate()).slice(-2);
document.getElementById("today").value = yyyy + '-' + mm + '-' + dd;
}
</script>
</html>上記のコードを.html形式のファイルとして保存し、ブラウザにドラッグ&ドロップすると、日付を選択できるフォームが表示されます。
また、右のカレンダーのアイコンをクリックすると、カレンダーが表示され、任意の日付を選択できます。
コードのポイント
ポイントは、以下の4つです。
- window.onloadにより、ページが開かれたときに実行される
- getMonth()は0〜11までの整数値を取得するので、+1する必要がある
- 月は、01、02のように二桁にする必要があるので、0を先頭に付けた上で、右から2文字を取得するようにした
- 日付の形式は、『YYYY-MM-DD』である必要がある