필터링 요소
하나 이상의 자식 요소를 가지고 모든 요소는, 필터링 할 수 있습니다.
어떻게 검색 필드를 만들려면 :
- 당신은 필터링 할 할 요소는 포함해야 data-filter="true" 속성을.
- 만들기 <input> 지정된 ID를 가진 요소 및 추가 data-type="search" 속성을. 이 기본 검색 필드를 생성합니다. 랩 <input> 형태를하고 추가 "ui-filterable" 받는 클래스를 <form> 요소 -이 검색 필드 필터링 할 수있는 요소 사이의 여백을 조정합니다.
- 그 후, 추가 data-input 필터링 할 수있는 요소에 속성을. 그 값은의 ID와 일치해야합니다 <input> 요소를.
다음, 우리는 필터링 목록보기를 만들었습니다 :
목록의 요소 검색
<form class="ui-filterable">
<input id="myFilter"
data-type="search">
</form>
<ul data-role="listview"
data-filter="true" data-input="#myFilter" >
<li><a href="#">Adele</a></li>
<li><a href="#">Billy</a></li>
<li><a href="#">Calvin</a></li>
</ul> »그것을 자신을 시도 팁 : 검색 필드의 기대 값을 설명하는 짧은 힌트를 지정하는 자리 표시자를 사용하여
사용자 정의 필터
각각의 하위 요소 내부의 텍스트 (같은 필터링에 사용되는 실제 텍스트입니다 "Adele" 또는 "B" 에 대한 "Billy" ). 대신 사용자 정의 필터 텍스트로 검색을 필터링 할 경우, 당신은 자식 요소에 데이터 filtertext 속성을 추가 할 수 있습니다 :
당신이 사용하는 경우 data-filtertext 요소에 속성을 특정 요소의 원본 텍스트 / 내용이 위의 예에서, 당신은 더 이상 목록 항목을 검색 할 수 있습니다 (필터링을 무시하지 않습니다 "Adele" . 당신은 찾을 수 있습니다 키워드를 입력하여 아델 "f, a, v 또는 fav ".)
더 예
축소 목록을 필터
어떻게 목록의 축소 세트를 필터링합니다.
필터 테이블
어떻게 테이블을 필터링합니다.
필터 <div> 요소를
필터 방법 <div> 아이 포함하는 요소 <p> 요소를.