Web 開発では、この場所がチェックできることを示すためにいくつかのチェックボックスを表示する必要がある場合がありますが、ユーザーに「この場所はチェックできる」ということだけを通知したい場合もあります。ここ (情報表示ページなど) では、チェック ボックスを読み取り専用に設定する必要があります。
読み取り専用というと、readonly 属性を使用することを思い浮かべがちですが、チェック ボックスの場合、この属性は期待される効果とは異なります。その理由は、 readonly 属性がページ要素 (テキストボックスなど、readonly が設定されていると入力ボックスのテキスト内容を変更できない) の value 属性に関連付けられており、チェックボックスがオン/オフになっているためです。 value 属性を変更するだけです。 チェックボックスについては、readonly が設定されている場合でも、チェック/キャンセルが可能です。効果は以下の通りです:
readonly="readonly" /> | |
option a option b option c |
option a option b option c |
readonly と同様に、disabled 属性もあります。この属性の機能は、ページ要素を使用不可に設定することです。つまり、対話型操作を実行できません (value 属性の変更不可、チェック済みステータスを含みます)。変更することはできませんなど)。効果は以下の通りです:
disabled="disabled" /> | |
option a option b option c |
option a option b option c |
disabled="disabled" /> |
|
オプション オプション b オプション c | オプション a オプション b オプション c |
onclick="return false;" checked="checked" /> |