最初隐藏的物品＆＃34;休息＆＃34;在Listview上（＆＃39;刷新＆＃39;）

Question

我可以看到此问题是bug in v1.3，但已修复。但我现在正在使用JQM 1.4。

在我的HTML中，我有以下代码：

<ul class="storeList"
    data-role="listview"
    data-inset="true"
    data-filter="true"
    data-enhanced="true"
    data-input="#store-filter"></ul>

data-enhanced="true"指示可过滤小部件在实例化期间跳过这些DOM操作

然后在jQuery中我使用Ajax获取数据（在页面加载时）并动态添加列表项：

// loop
// If user is in city A, hideItem = True
if(hideItem) {
    $(li).attr('class', 'ui-screen-hidden');
}
storeList.append(li);
// loop-end

// listview needs to be initialized before it can be enhanced/refreshed.  
// That's why we do a .listview() first then .listview('refresh')
$('.storeList').listview().listview('refresh');

问题在于.listview('refresh')删除了ui-screen-hidden类。

Filterable Widget上有一些相关内容（请参阅Providing pre-rendered markup部分），但我不是明智之举。

任何帮助表示感谢。

Answer 1

我的目标是显示动态创建的商店列表，但仅显示用户当前所在城市的商店。

为此，我想使用Filterable Widget中的enhanced选项过滤列表。

<ul data-enhanced="true"></ul>

data-enhanced="true"指示可过滤小部件在实例化期间跳过DOM操作，从而加快启动/加载过程。

然后我将ui-screen-hidden添加到非奥斯陆的所有列表项中。由于列表是动态创建的，我必须刷新Listview。

$('.storeList').listview().listview('refresh');

问题是Listview刷新删除了ui-screen-hidden类，并显示了我的整个列表。

事实证明，enhanced功能似乎Listview has not yet gotte。

  

没有增强选项的小部件是：Listview，   选择菜单，面板，工具栏，导航栏和滑块。

@ezanker建议我可以将我的位置放在输入过滤器中。由于两个原因，这是行不通的： 1.视图页面上的过滤器按商店名称过滤，而不是按位置过滤 2.即使按位置过滤，也会在我删除城市名称后立即显示所有商店。

所以我做的是将自己的hidden类添加到列表项中。

if(location !== (store.city+store.countryID)) {
    $(li).attr('class', 'hidden');
}

要更改位置，我会转到新页面，选择位置并返回我的视图页面。要应用我的新位置，我会在pagebeforeshow事件中进行一些编码。

$('#storeListPage').on('pagebeforeshow',function(e,data){
    //First we remove all hidden items
    $('.storeList li').removeClass('hidden ui-screen-hidden');

    // Then we only shows the items for selected city
    var location = $('a.selectLocation .city').text() + $('a.selectLocation .countryID').text();
    var selector = '.storeList li:not([data-location="'+location+'"])';
    $(selector).addClass('hidden');
});

现在我的列表按位置过滤，我可以按商店名称进一步过滤列表。

可能有其他方法可以实现这一点，但这对我有用：）