Binary 타입의 on/off 혹은 true/false 데이터 입력을 위해 모바일 환경에서 보편적으로 사용되는 “flip” switch는 슬라이드처럼 드래그를 하거나 터치를 통해 선택할 수 있습니다.
Flip 스위치를 만들기 위해서는 select 태그에 on과 off의 두 option 태그를 생성하고, label 태그의 for 속성의 값과 select 태그의 id 속성값을 매칭하고, 상위 div 태그로 감싸며 속성으로 data-role=”fieldcontain”을 추가합니다.
<div data-role="fieldcontain">
<label for="slider">Select slider:</label>
<select name="slider" id="slider" data-role="slider">
<option value="off">Off</option>
<option value="on">On</option>
</select>
</div>
자바스크립트에서 filp switch를 refresh하는 방법은 아래와 같습니다.
var myswitch = $("select#bar");
myswitch[0].selectedIndex = 1;
myswitch .slider("refresh");
'----- IT ----- > jQuery Moblie' 카테고리의 다른 글
jQuery Mobile - Checkboxes(체크박스) (0) | 2011.06.08 |
---|---|
jQuery Mobile - Radio buttons(라디오버튼) (0) | 2011.06.07 |
jQuery Mobile - Slider(슬라이더) (0) | 2011.06.02 |
jQuery Mobile - Text inputs(텍스트) (0) | 2011.05.31 |
jQuery Mobile - Form Elements samples (0) | 2011.05.30 |
댓글