กรอง jQuery มือถือ
คุณสามารถกรององค์ประกอบ
องค์ประกอบทั้งหมดหากหนึ่งหรือมากกว่าองค์ประกอบย่อยสามารถกรอง
วิธีการสร้างช่องค้นหา:
- คุณต้องการกรององค์ประกอบต้องใช้ข้อมูลกรองแอตทริบิวต์ = "true"
- สร้าง <input> และระบุ ID รวมทั้งข้อมูลประเภทในองค์ประกอบ = "ค้นหา" แอตทริบิวต์ นี้จะสร้างช่องค้นหาขั้นพื้นฐาน ก <input> จะอยู่ในรูปแบบรูปแบบ <form> องค์ประกอบที่ใช้ "UI กรอง" ชั้น - ชั้นนี้จะมีการปรับนอกช่องค้นหาและอยู่ห่างจากไส้กรอง
- จากนั้นเพิ่มแอตทริบิวต์ข้อมูลป้อนสำหรับไส้กรอง ค่านี้จะต้องมี ID <input> องค์ประกอบ
ต่อไปเราจะสร้างรายการกรอง:
องค์ประกอบค้นหารายการ
<แบบฟอร์มคลา = "UI กรอง ">
<input id = "myFilter" ข้อมูล ประเภท = "ค้นหา">
</ form>
<ul ข้อมูลบทบาท = "ListView " data-กรอง = "true" ข้อมูลอินพุต = "# myFilter">
<li> <a href="#"> Adele </a> </ li>
<li> <a href="#"> บิลลี่ </a> </ li>
<li> <a href="#"> Calvin </a> </ li>
</ ul>
<input id = "myFilter" ข้อมูล ประเภท = "ค้นหา">
</ form>
<ul ข้อมูลบทบาท = "ListView " data-กรอง = "true" ข้อมูลอินพุต = "# myFilter">
<li> <a href="#"> Adele </a> </ li>
<li> <a href="#"> บิลลี่ </a> </ li>
<li> <a href="#"> Calvin </a> </ li>
</ ul>
ลอง»
เคล็ดลับ: คุณสามารถใช้แอตทริบิวต์ตัวยึดในช่องค้นหาเพื่อตั้งค่าข้อความ:
กรองแบบกำหนดเอง
แทรกลงในข้อความโดยทั่วไปของรายการแต่ละรายการคือการใช้เป็นข้อความตัวกรอง (เช่นสอดคล้องกับ "อเดล" หรือ "B" สอดคล้องกับ "บิลลี่") แต่ถ้าคุณต้องการที่จะระบุตัวกรองข้อความที่กำหนดเองคุณจะต้องใช้แอตทริบิวต์ข้อมูล filtertext ในองค์ประกอบของเด็ก:
 | ถ้าคุณใช้แอตทริบิวต์ข้อมูล filtertext ในองค์ประกอบขององค์ประกอบเนื้อหาแหล่งที่มาของข้อความจะถูกละเว้นเมื่อกรองแล้วถ้าคุณต้องมองหารายชื่อของรายการ "อเดล" ที่ต้องใช้คำหลักเป็น: F, A, V หรือ ชอบ |
|---|
ตัวอย่างเพิ่มเติม
กรองรายการพับ
วิธีพับรายการตัวกรอง
กรองตาราง
วิธีการกรองเนื้อหาตาราง
ตัวกรอง <div>
วิธีการกรองเด็ก <div> มี <p> องค์ประกอบ