ตัวกรอง HTML W3.JS
องค์ประกอบตัวกรอง:
w3.filterHTML(selector)
กรองรายการ
ค้นหาชื่อในช่องป้อนข้อมูล
- {{ชื่อลูกค้า}}
ตัวอย่าง
<input oninput="w3.filterHTML('#id01',
'li', this.value)">
<ul id="id01">
<li>Alfreds Futterkiste</li>
<li>Berglunds snabbkop</li>
...
ตารางกรอง
ชื่อ | ประเทศ |
---|---|
ซูเปอร์มาร์เก็ตของ Berglund | สวีเดน |
เหนือใต้ | สหราชอาณาจักร |
กล่องใส่อาหารของอัลเฟรด | เยอรมนี |
อาหารราชวงศ์ | เยอรมนี |
รวมโกดังอาหาร | อิตาลี |
อาหารพิเศษของปารีส | ฝรั่งเศส |
ซื้อขายเกาะ | สหราชอาณาจักร |
ห้องเก็บไวน์ Laughing Bacchus | แคนาดา |
ตัวอย่าง
<input oninput="w3.filterHTML('#id01', '.item', this.value)">
<table
id="id01">
<tr>
<th>Customer</th>
<th>City</th>
<th>Country</th>
</tr>
<tr class="item">
<td>Alfreds Futterkiste</td>
<td>Berlin</td>
<td>Germany</td>
</tr>
<tr class="item">
<td>Berglunds snabbkop</td>
<td>Lulea</td>
<td>Sweden</td>
</tr>
...