disabled属性

button要素のdisabled属性は、button要素を無効にする属性。

ブラウザ対応

構文

<button type="ボタンのタイプ" disabled>ボタン名</button>

disabled属性は、論理属性である。

disabled属性が存在する場合、そのbutton要素は無効になる。

サンプルコード

送信ボタン

<button type="submit" disabled>送信</button>

<button disabled>送信</button>

リセットボタン

<button type="reset" disabled>リセット</button>

汎用ボタン

<button type="button" disabled>汎用ボタン</button>

サンプル

HTMLソースコード

<form action="sample-button.php" method="post" target="_blank">
	<p>
		<label>
			１行テキスト入力欄：
			<input name="sampleName">
		</label>
	</p>
	<p>
		無効ボタン： 
		<button disabled>type属性なし</button>
		<button type="submit" disabled>送信ボタン</button>
		<button type="reset" disabled>リセットボタン</button>
		<button type="button" disabled>汎用ボタン</button>
	</p>
	<p>
		有効ボタン： 
		<button>type属性なし</button>
		<button type="submit">送信ボタン</button>
		<button type="reset">リセットボタン</button>
		<button type="button">汎用ボタン</button>
	</p>
</form>

実際の表示

無効ボタン：

有効ボタン：