Question

我使用数据过滤器显示功能使用jqueryMobile创建了一个列表视图。此功能隐藏列表元素，并在您键入时显示与输入字符匹配的元素。我的数据源是本地的（意味着列表是静态填充的）。

我想要做的是显示所有项目而不需要输入任何字符，但是当列表本身获得焦点时（并在丢失时隐藏它们）。

我知道我可以jQuery所有元素并自己进行展示/隐藏，但我想知道是否有一个我不知道的开箱即用解决方案。

Answer 1

没有开箱即用的解决方案，但是，您可以执行以下操作。

当input 聚焦时，设置.listview( "option", "filterReveal", true );并通过添加ui-screen-hidden jQM类手动隐藏所有列表视图项。当模糊时，反转上一个操作。

注意： filterReveal 在jQM 1.4.0中已弃用，将在1.5.0中删除。

var list = $("#list");

$("input").on("focus", function () {
    $(this).val("");
    list.listview("option", "filterReveal", false);
    list.children().removeClass("ui-screen-hidden");
    list.listview("refresh");
}).on("keydown", function () {
    list.listview("option", "filterReveal", true);
    list.children().addClass("ui-screen-hidden");
    list.listview("refresh");
});

<强> Demo

jQueryMobile listview带过滤器显示，点击显示项目

1 个答案: