Question

'Ello StackOverflowers。

所以这是我的情景：我使用ListView填充localStorage。所有工作都填充了listview并“刷新”它。但是！

现在我想添加一个搜索栏，如果ListView添加了超过5个元素。这是我目前的代码（不起作用）：

if (resultLength > 5)
{
    // alert('5 or more elemnts found.');
    $("#ConnectionList").attr("data-filter", true);
    $("#ConnectionList").attr("data-filter-placeholder", "Search...");
}

当我取消注释alert时，它会正确触发。在两行后面添加.listview('refresh')似乎也不起作用。

我做错了什么？

提前谢谢。

Answer 1

不幸的是，这不起作用。 jQuery Mobile 无法动态地将过滤器添加到现有列表视图中。

但是有一个解决方法。在填充列表视图计数之前，您尝试填充的元素数量，如果数字为5或更多，则删除当前列表视图并在同一位置添加新的列表视图。这是另一件奇怪的事情，如果你从头开始创建一个列表视图（考虑到过滤器），将成功生成过滤器。

我为你做了一个例子：http://jsfiddle.net/Gajotres/SS7vJ/

$(document).on('pagebeforeshow', '#index', function(){       
    $('<ul>').attr({'id':'test-listview','data-role':'listview', 'data-filter':'true','data-filter-placeholder':'Search...'}).appendTo('#index [data-role="content"]');
    $('<li>').append('<a href="#">Audi</a>').appendTo('#test-listview');
    $('<li>').append('<a href="#">Mercedes</a>').appendTo('#test-listview');
    $('<li>').append('<a href="#">Opel</a>').appendTo('#test-listview');
    $('#test-listview').listview().listview('refresh');
});

另外不要忘记调用.listview（两次，第一次没有刷新参数，第二次使用刷新参数。没有它你会收到这个错误：

cannot call methods on listview prior to initialization

您可以在 ARTICLE 中找到有关此问题的更多信息，为了透明，这是我的个人博客。或者找到 HERE 。查找名为：标记增强问题的章节。

jQuery Mobile设置ListView的属性

1 个答案: