jQuery mobileのフォームについてメモ。jQuery mobile Docs – formsにいっぱいサンプルある。チェックボックスとラジオボタンとスライダーをお試し。
確認ページ：hello_jQuery_mobile_form.html
- 全体をdata-role=”fieldcontain”で囲む
- チェックボックス
-
<fieldset data-role="controlgroup"> <legend>Checkbox</legend> <input type="checkbox" name="checkbox01" id="checkbox01" class="custom" /> <label for="checkbox01">checkbox01</label> <input type="checkbox" name="checkbox02" id="checkbox02" class="custom" /> <label for="checkbox02">checkbox02</label> <input type="checkbox" name="checkbox03" id="checkbox03" class="custom" /> <label for="checkbox03">checkbox03</label> </fieldset>
- ラジオボタン
-
<fieldset data-role="controlgroup"> <legend>Radio button</legend> <input type="radio" name="radio01" id="radio01" value="custom" checked="checked"/> <label for="radio01">radio01</label> <input type="radio" name="radio01" id="radio02" value="custom" /> <label for="radio02">radio02</label> <input type="radio" name="radio01" id="radio03" value="custom" /> <label for="radio03">radio03</label> </fieldset>
- スライダー
-
<label for="slidernum">Slider</label> <input type="range" name="slidernum" id="slidernum" value="5" min="1" max="10" data-highlight="false" />
参考サイト
関連エントリー
