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

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