<input type=radio>

<input type=radio> (HTML)

[1] HTMLinput 要素は、 type 属性が radio の時、ラジオ・ボタン制御子を定義します。

[2] 仕様書:

[3] 属性:

属性名属性値既定値説明出典
accesskey%Character[HTML 4]
align配置[HTML 4] 非推奨
checked(真偽値属性)()初期状態[HTML 4]
class[HTML 4] %coreattrs
datafldデータ欄[HTML 4] 予約
dataformatasデータ書式[HTML 4] 予約
datasrc%URI(なし)データ源[HTML 4] 予約
dir書字方向[HTML 4] %i18n
disabled(真偽値属性)(偽)無効[HTML 4]
id一意識別子[HTML 4] %coreattrs
lang自然言語[HTML 4] %i18n
xml:lang自然言語[XHTML 1]
languageスクリプト言語WinIE 4+
name制御子名[HTML 4]
onblur%Script焦点を失した時[HTML 4]
onchange%Script現在値変更時[HTML 4]
onclick[HTML 4] %events
ondblclick[HTML 4] %events
onfocus%Script焦点を得た時[HTML 4]
onkeydown[HTML 4] %events
onkeypress[HTML 4] %events
onkeyup[HTML 4] %events
onmousedown[HTML 4] %events
onmousemove[HTML 4] %events
onmouseout[HTML 4] %events
onmouseover[HTML 4] %events
onmouseup[HTML 4] %events
onselect%Script文選択時[HTML 4]
readonly(真偽値属性)(偽)読取専用[HTML 4]
styleスタイル情報[HTML 4] %coreattrs
tabindexNUMBERタブ順[HTML 4]
title注釈的題[HTML 4] %coreattrs
typecheckboxtext制御子の種類[HTML 4]
value初期値[HTML 4]
vcard_name自動補完WinIE 5+

名前

[4] 制御子名は name 属性で指定します。

一つのフォーム内で同じ制御子名のラジオ・ボタンは、 互いに排他的となります。つまり、そのうちの1つだけが「入」で、 他はすべて「切」となります。 HTML 4 17.2.1

選択状態

初期状態

[7] checked 属性が指定されていればの状態です。 HTML 4 17.2.1

[8] ラジオ・ボタン制御子は、本来、 1つ以上の選択肢から丁度1つを選択させるためのフォーム制御子です。 しかし、選択肢のいずれかに checked 属性を与えることで初期状態において選択されているものを選ぶという方式を採っているために、 1つも checked とされていない場合や複数 checked とされている場合もあり得ます。

[9] 著者に対する制約 著者は、1つのラジオ・ボタン制御子集合において、 複数を選択状態としてはなりませんWF2 2.3

[10] 零個選択時の利用者エージェントの動作 利用者エージェントは、1つのラジオ・ボタン制御子集合虫のいずれも選択状態とされていない場合でも、 そのままどれも選ばれていない状態としなければなりませんWF2 2.3

[11] 零個選択時に関する仕様の変遷 >>10 の場合について、 HTML 2.0 は、最初のものを選択状態とすると規定されていました。 RFC 1866 8.1.2.4

HTML 4.0 はこれに言及していませんでしたが、 HTML 4.01 は、実装状況を鑑みて、 挙動は未定義としました。 著者は1つ選択するべきですとされえていました。 HTML 4.01 17.2.1

Web Forms 2.0 は仕様を実装に合わせ、 いずれも選択しないままとしなければなりませんとしました。 同時に、著者は1つ選択しなければなりませんともしています。 WF2 2.3

[12] 複数選択時の利用者エージェントの動作

複数のラジオ・ボタン制御子が選択状態とされている場合、 利用者エージェントは、 最後のものだけを選択状態としなければなりませんWF2 2.3

Web Forms 2.0 以前はこの状態に関する規定はありませんでした。

状態の変化

[9] ラジオ・ボタンを活性化すると (焦点をあてると)、 ラジオ・ボタンの値が切り替わります HTML 4 17.11.2

[13] 選択済み制御子挿入時の利用者エージェントの動作

選択状態のラジオ・ボタン制御子文書に挿入すると、 利用者エージェントは、 他のラジオ・ボタン制御子は未選択状態にしなければなりませんWF2 2.3 つまり、新たに挿入した選択肢だけが選択された状態になります。

Web Forms 2.0 以前はこの状態に関する規定はありませんでした。

メモ

成功

[6] フォームの提出の時に、「入」 の状態になっているラジオ・ボタン制御子だけが成功状態です HTML 4 17.2.1

利用可能性

[10] スクリプトによる補助以上の動作: ラジオ・ボタン制御子の選択状態の変更に伴って何らかの動作を行うようにスクリプトを記述することがありますが、 その動作は補助的で非本質的な範囲にとどめるべきです。

良い例: 選択肢によって別の入力項目が意味を成さなくなるので、 その項目の disabled 属性を適当に設定します。 そうすることで、それぞれの場面に合わない入力項目で利用者が混乱することを避けられます。

悪い例: 選択を行った瞬間に、 その選択肢で説明された別のに移動します。 (具体的な例: ソフトウェア配布頁で、 OS の名前が選択肢になっていて、 ラジオ・ボタンを選択すると更に先の作業に進みます。) ラジオ・ボタン制御子には選択してもそれ自体で不可逆な動作は行われず、 提出するまでは何度でも選択をやり直せることが期待されています。 そのような convention から外れた動作は利用者を混乱させるだけです。 もしラジオ・ボタン制御子で選択してから押しボタンを押すのが 2度手間だというのであれば、 最初から押しボタン制御子だけを用意しておけば良いのです。

関連

[5] 同じ制御子名のチェック箱を複数用意することで、 一つの名前に対して複数の値の入・切を選択させられます。 これは select 要素によるメニュー制御子と同じ効能です。

[21] <menuitem type=radio>

メモ

[14] [whatwg] Make radio button group suffering from being missing ( ( 版)) http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2011-January/029733.html

[15] ncsa-mosaic/CHANGES at master · alandipert/ncsa-mosaic ( ( 版)) https://github.com/alandipert/ncsa-mosaic/blob/master/CHANGES#L237

[16] ncsa-mosaic/CHANGES at master · alandipert/ncsa-mosaic ( ( 版)) https://github.com/alandipert/ncsa-mosaic/blob/master/CHANGES#L441

[17] Web Applications 1.0 r8704 Change how we define what happens when radio buttons are clicked but the event is canceled ( ( 版)) http://html5.org/r/8704

[18] Make forms work in shadow trees ( (annevk著, )) https://github.com/whatwg/html/commit/927fda0f305452a9c54a25d3ebf9a6ed5ae29fd3

[19] Add radio button constraint validation example (domenic著, ) https://github.com/whatwg/html/commit/a6ea8e505dad484bbe9124534f2c51e6a92fab0e

[20] Align activation behavior with changes to DOM Standard (annevk著, ) https://github.com/whatwg/html/commit/7beb920ba2e1a71246b81d86005f223a0d7ac8ab