Close
<input readonly>は、
フォームのテキストコントロールを読み取り専用にする際に使用します。
readonly属性は、ユーザーがフォームコントロールを編集できるかどうかを制御します。
input要素にreadonly属性を指定すると、ユーザーはその要素を変更できません。
readonly属性を指定できるのは、テキスト入力のフォームコントロールのみです。
チェックボックスやボタンなどのテキスト入力以外のコントロールには、readonly属性は適用されません。
チェックボックスやボタンなどは、読み取り専用と無効の区別がつかないため、readonly属性を指定できない仕様になっています。
チェックボックスやボタンなどを無効にする場合は、disabled属性を指定します。
readonly属性は要素を読み取り専用にするのに対し、disabled属性は要素を無効にします。
readonly属性を指定した読み取り専用コントロールは、引き続き機能します。
disabled属性を指定した無効なコントロールは、有効になるまでコントロールとして機能しません。
以下のサンプルでは、
1行目と2行目のinput要素にはreadonly属性を指定して読み取り専用にしています。
3行目のinput要素にはdisabled属性を指定して無効にしています。
どちらも入力編集できない点は同じですが、読み取り専用と無効の違いを確認してみてください。
<form action="products.cgi" method="post" enctype="multipart/form-data">
<table>
<tr> <th> 商品ID <th> 商品名 <th> 価格 <th> 操作
<tr>
<td> <input readonly="readonly" name="1.pid" value="H412">
<td> <input required="required" name="1.pname" value="ポータブルランプ">
<td> $<input required="required" type="number" min="0" step="0.01" name="1.pprice" value="49.99">
<td> <button formnovalidate="formnovalidate" name="action" value="delete:1">削除</button>
<tr>
<td> <input readonly="readonly" name="2.pid" value="FG28">
<td> <input required="required" name="2.pname" value="テーブルランプ">
<td> $<input required="required" type="number" min="0" step="0.01" name="2.pprice" value="24.99">
<td> <button formnovalidate="formnovalidate" name="action" value="delete:2">削除</button>
<tr>
<td> <input disabled="disabled" name="3.pid" value="FT12">
<td> <input required="required" name="3.pname" value="足元ランプ">
<td> $<input required="required" type="number" min="0" step="0.01" name="3.pprice" value="12.99">
<td> <button formnovalidate="formnovalidate" name="action" value="delete:3">削除</button>
<tr>
<td> <input required="required" name="4.pid" value="" pattern="[A-Z0-9]+">
<td> <input required="required" name="4.pname" value="">
<td> $<input required="required" type="number" min="0" step="0.01" name="4.pprice" value="">
<td> <button formnovalidate="formnovalidate" name="action" value="delete:4">削除</button>
</table>
<p> <button formnovalidate="formnovalidate" name="action" value="add">追加</button> </p>
<p> <button name="action" value="update">保存</button> </p>
</form>HTMLの仕様では、input要素には終了タグ</input>はありません。
どのカジノが自分に最適か分からないですか?