設定チェックボックスが選択できない、チェックボックスが選択できない_html/css_WEB-ITnose

Web 開発: チェック ボックスの読み取り専用効果を設定します

Web 開発では、この場所がチェック可能であることを示すためにいくつかのチェック ボックス (チェックボックス) を表示する必要がある場合がありますが、単に通知したい場合もあります。ユーザーが「ここをチェックできます」をここ（情報表示ページなど）にチェックさせたくない場合は、チェックボックスを読み取り専用に設定する必要があります。

読み取り専用というと、readonly 属性を使用することを考えがちですが、チェック ボックスの場合、この属性は期待される効果とは異なります。その理由は、readonly 属性がページ要素 (テキストボックスなど、readonly が設定されている場合は入力ボックスのテキスト内容を変更できない) の value 属性に関連付けられており、チェックボックスをオン/オフにしてもその value 属性は変更されないためです。 、チェックされた状態のみ。したがって、チェックボックスについては、読み取り専用が設定されている場合でも、チェック/キャンセルすることができます。効果は次のとおりです:

<input type="text" name="realname" value="只读的文本内容..." readonly="readonly" /> 	<input type="checkbox" name="optiona" readonly="readonly" />option a<input type="checkbox" name="optionb" readonly="readonly" />option b<input type="checkbox" name="optionc" readonly="readonly" />option c

option a
option b
option c

readonly と同様に、この属性の機能は、ページ要素を使用不可、つまり no に設定することです。対話的な操作（変更できない値属性、変更できないチェック状態などを含む）を実行できます。効果は次のとおりです。

<input type="text" name="realname" value="输入的文本内容..." disabled="disabled" /> 	<input type="checkbox" name="optiona" disabled="disabled" />option a<input type="checkbox" name="optionb" disabled="disabled" />option b<input type="checkbox" name="optionc" disabled="disabled" />option c 	

option a
option b
option c

上記から、readonly もdisabled も望ましい効果が得られないことがわかります。これは直接実装できないため、回避してシミュレーションすることができます。コードは次のとおりです:

<input type="checkbox" name="chkAllowed" onclick="return false;" checked="checked" /> 

関連リンク