reset

input要素のtype属性にresetを指定すると、リセットボタンになる。

リセットボタンとは、入力欄をリセットするボタンのことで、初期設定値が空の入力欄は空に戻し、初期設定値がある入力欄は初期設定値に戻す。

ブラウザ対応

構文

<input type="reset">

属性

属性 説明
autofocus属性 オートフォーカスさせる属性。
disabled属性 無効にする属性。
form属性 属するform要素のid属性値を指定する属性。
name属性 名前を指定する属性。
value属性 値を指定する属性。リセットボタンにおいては、リセットボタン上に表示するテキスト（ボタン名）である。

サンプルコード

<input type="reset">

value属性を指定しない場合、リセットボタン上に表示するテキストは、ブラウザ次第になってしまう。

value属性あり

<input type="reset" value="ボタン名">

サンプル

HTMLソースコード

<form action="sample-input-type.php" method="post" target="_blank">
	<p>
		<label>
			１行テキスト入力欄（初期設定値なし）：
			<input type="text" name="sampleNameA">
		</label>
	</p>
	<p>
		<label>
			１行テキスト入力欄（初期設定値あり）：
			<input type="text" name="sampleNameB" value="初期設定値">
		</label>
	</p>
	<p>
		value属性なし： <input type="reset">
	</p>
	<p>
		value属性あり： <input type="reset" value="リセットボタン">
	</p>
</form>

実際の表示

value属性なし：

value属性あり：