私たちはカジノサイトを独自にレビューしています。当社のリンクを通じてサインアップすると、追加料金なしで当社に手数料が発生する場合があります。
<input type=radio>は、ラジオボタンの入力欄を表す際に使用します。
input要素のtype属性の値に radio を指定すると、
input要素はラジオボタングループのなかの1つだけがチェックされている状態(true)
に設定できるコントロールを表します。
複数のinput type=radioを使用してラジオボタングループを作成するには、
name属性を同じ値にして、input要素を同じツリー内に配置します。
ラジオボタンの1つをtrueにした場合、グループ内の他のラジオボタンはfalseになります。
以下のサンプルは、input type=radioを使用して3つの選択肢から1つを選択するコントロールを作成しています。
最初のinput要素にはchecked属性を指定して、初期状態でチェックを付けています。
<fieldset>
<legend><h2>ご希望の連絡方法</h2></legend>
<p><label><input type=radio name=contact_pref checked> 電話</label></p>
<p><label><input type=radio name=contact_pref> 手紙</label></p>
<p><label><input type=radio name=contact_pref> メール</label></p>
</fieldset>
以下のサンプルは、ピザの注文画面を想定しています。
ラジオボタンとチェックボックスの違いは、
複数の選択肢から1つを選択するか、
複数の選択肢から複数を選択するかの違いです。
<form method="post" enctype="application/x-www-form-urlencoded" action="order.cgi">
<p><label>お名前: <input name="custname"></label></p>
<p><label>電話番号: <input type=tel name="custtel"></label></p>
<p><label>メール: <input type=email name="custemail"></label></p>
<fieldset>
<legend>ピザのサイズ</legend>
<p><label><input type=radio name=size value="small">Small</label></p>
<p><label><input type=radio name=size value="medium">Medium</label></p>
<p><label><input type=radio name=size value="large">Large</label></p>
</fieldset>
<fieldset>
<legend>ピザのトッピング</legend>
<p><label><input type=checkbox name="topping" value="bacon">ベーコン</label></p>
<p><label><input type=checkbox name="topping" value="cheese">チーズ</label></p>
<p><label><input type=checkbox name="topping" value="onion">オニオン</label></p>
<p><label><input type=checkbox name="topping" value="mushroom">マッシュルーム</label></p>
</fieldset>
<p><label>希望配達時間: <input type=time min="11:00" max="21:00" step="900" name="delivery"></label></p>
<p><label>ご希望など: <textarea name="comments"></textarea></label></p>
<p><button>上記内容で注文する</button></p>
</form>
初期状態でチェックの付いたボタンを持たないラジオボタングループは作成可能ですが、使用しないことが推奨されています。
初期状態でいずれにもチェックが付いていないラジオボタングループは、
一般的にはユーザーインターフェイスとして不十分と考えられています。
HTMLの仕様では、input要素には終了タグ</input>はありません。