📅 最后修改于: 2023-12-03 15:32:09.102000 🧑 作者: Mango
jQuery Mobile 是一款基于 jQuery 的 HTML5 响应式 Web 前端框架，其主要应用场景是移动设备上的 Web 应用程序开发。
在 jQuery Mobile 中，通过 filterable widget 可以实现一个可过滤类选项列表，即用户可以通过关键字筛选列表中的项，以便更快地找到目标。
<div data-role="fieldcontain">
<label for="filter-basic">基础过滤：</label>
<input type="text" name="filter-basic" id="filter-basic" data-type="search">
</div>
<ul data-role="listview" data-filter="true" data-input="#filter-basic">
<li><a href="#">萝卜</a></li>
<li><a href="#">菜花</a></li>
<li><a href="#">西兰花</a></li>
<li><a href="#">地瓜</a></li>
</ul>
$(document).ready(function() {
$("#filter-basic").on("keyup", function() {
var value = $(this).val().toLowerCase();
$("ul[data-role='listview'] li").filter(function() {
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
});
});
});