:indeterminate 不確定疑似クラス

ラジヲボタンが、どちらも選ばれないなんておかしいよ といった時には、

ラジオボタンは、そのグループ中でどれかが必ず選択されなければなりませんが、それが選択されていない不確定な状態に、スタイルを(:indeterminate疑似クラス)で追加できます。



チェックボックスで、indeterminateな状態を作成する場合は、javascriptを使います。


<p><input type="radio" id="rda" name="rdo"><label for="rda">ラジオA</label><br>
<input type="radio" id="rdb" name="rdo"><label for="rdb">ラジオB</label></p>
<hr />
<p> <input type="checkbox" id="cbox1" value="first_checkbox"> <label for="cbox1">This is the first checkbox</label>
<input type="checkbox" id="cbox2" value="second_checkbox" > <label for="cbox2">This is the second checkbox</label></p>
.entry-content input:indeterminate + label {
 font-weight: bold;
 color: red;
}
jQuery(function($) {
 $("#cbox1").prop("indeterminate", true);
});

新着記事

コメントは受け付けていません。