JavaScriptのform.reset()とは？フォーム内容を一瞬で初期化する方法を解説
form.reset() は、フォーム内のすべての入力内容を初期状態に戻すためのメソッドです。
ボタン操作だけでなく、JavaScript からも自由にリセット処理を実行できます。
reset()メソッドとは？
reset() は、フォーム内のエレメント（input・select・textarea など）を
HTMLで指定された初期値に戻すメソッドです。
- テキスト入力 → 空に戻る
- チェックボックス → 初期状態に戻る
- ラジオボタン → 初期選択に戻る
- select（プルダウン） → 初期選択に戻る
ユーザーが入力した内容をまとめて消したいときに便利です。
使用例：フォーム内容をリセットする
フォーム名（または id）を使って reset() を呼び出します。
// フォーム名 form1 の内容をリセット
document.form1.reset();
document.form1.reset();
id を使う場合はこちら。
document.getElementById(“form1”).reset();
実際のフォーム例
<form id=”form1″>
名前：<input type=”text” name=”user”><br>
性別：
<input type=”radio” name=”gender” checked> 男性
<input type=”radio” name=”gender”> 女性
名前：<input type=”text” name=”user”><br>
性別：
<input type=”radio” name=”gender” checked> 男性
<input type=”radio” name=”gender”> 女性
<input type=”button” value=”リセット” onclick=”document.getElementById(‘form1’).reset()”>
</form>
→ ボタンを押すとフォームが初期状態に戻ります。
まとめ
form.reset()はフォーム内容を初期状態に戻すメソッド- テキスト・チェックボックス・ラジオボタンなどすべてリセット可能
- フォーム名または id を使って呼び出せる
- ユーザー操作の補助や入力クリア機能に便利
