ラジオボタン-radio button
①ラジオボタン - radio button
☆ソース
<fieldset data-role="controlgroup">
<legend>どれを買いますか:</legend>
<input type="radio" name="radio1" id="radio1" value="choice-1" />
<label for="radio1">Kindle Fire</label>
<input type="radio" name="radio1" id="radio2" value="choice-2" />
<label for="radio2">iPad mini</label>
<input type="radio" name="radio1" id="radio3" value="choice-3" />
<label for="radio3">Nexus 7</label>
</fieldset>
labelのforとinputのidを一致させます(ここではradiox)。
デモ
デモ
②横並びラジオボタン - radio button(horizontal)
☆ソース
<fieldset data-role="controlgroup" data-type="horizontal">
<legend>どれを買いますか:</legend>
<input type="radio" name="radio1" id="radio1" value="choice-1" />
<label for="radio1">Kindle Fire</label>
<input type="radio" name="radio1" id="radio2" value="choice-2" checked="checked" />
<label for="radio2">iPad mini</label>
<input type="radio" name="radio1" id="radio3" value="choice-3" />
<label for="radio3">Nexus 7</label>
</fieldset>
labelのforとinputのidを一致させます(ここではradiox)。
checked="checked"の付ける位置で、デフォルトのチェック位置が決まります。
デモ
checked="checked"の付ける位置で、デフォルトのチェック位置が決まります。
デモ