jQuery Mobile 클...login
jQuery Mobile 클래식 튜토리얼
작가:php.cn  업데이트 시간:2022-04-11 13:58:34

jQuery 모바일 양식 슬라이더



jQuery Mobile 슬라이더 컨트롤

슬라이더를 사용하면 숫자 범위에서 값을 선택할 수 있습니다.


슬라이더를 만들려면 <input type="range">를 사용하세요.

으아악

인스턴스 실행 중 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.

제한을 지정하려면 다음 속성을 사용하십시오.

  • max - 허용되는 최대값을 지정합니다.

  • min - 허용되는 최소값을 지정합니다.

  • 단계 - 유효한 숫자 간격을 지정합니다.

  • 값 - 기본값을 지정합니다.

팁: 버튼에 진행률 값을 표시하려면 다음을 추가하면 됩니다. data-show-value="true" 속성:

으아악

인스턴스 실행 중 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.

팁: 슬라이딩 버튼(작은 팝업 창과 유사)에 진행 상황을 표시하려면 다음을 사용할 수 있습니다. data-popup-enabled="true" 속성:

으아악

인스턴스 실행 중 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.

팁: 슬라이더 값을 강조 표시하려면 data-highlight="true"를 추가하세요.


으아악

인스턴스 실행 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.


토글 스위치

토글 스위치는 일반적으로 켜기/끄기 또는 참/거짓 버튼에 사용됩니다.


<input type="checkbox"> 요소를 사용하여 데이터 역할을 다음과 같이 지정할 수 있습니다. 스위치를 생성하려면 "flipswitch"를 사용하세요.

으아악

인스턴스 실행 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.

기본적으로 스위치 텍스트는 "켜기" 및 "끄기"입니다. 당신은 사용할 수 있습니다 이를 수정하려면 data-on-text 및 data-off-text 속성을 사용하세요.

으아악

인스턴스 실행 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.

팁:스위치 체크박스는 "checked" 속성을 사용하여 기본 옵션을 설정할 수 있습니다:

으아악

인스턴스 실행 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.


实例

더 많은 예

범위 슬라이더

으아악

인스턴스 실행 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.

간격 값으로 슬라이더를 만듭니다.

슬라이더 스타일

으아악

인스턴스 실행 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.

슬라이더 스위치의 스타일을 설정합니다.

PHP 중국어 웹사이트