jquery mobile - 如何对两个数据集使用listview数据过滤器？

Question

我有一个带有两个 data-role="listview" 的 JQM 页面。它们都共享相同的数据集，一个列表视图是纯文本的，另一个也包含图标。

我想在两个列表视图上使用 data-filter="true" 选项，但只使用一个过滤器，它会更新两个列表视图。

我对如何做到这一点一无所知，因此非常感谢任何提示。

这是我所拥有的：

 <ul data-role="listview" data-filter="true" data-divider-theme="c">
    <li data-role="list-divider">B</li>
    <li><a href="#profile" data-transition="slide"><img src="loc/icons/brandSprite.png" class="ui-li-icon">One</a></li>
    <li><a href="#profile" data-transition="slide"><img src="loc/icons/brandSprite.png" class="ui-li-icon">Two</a></li>
    <li><a href="#profile" data-transition="slide"><img src="loc/icons/brandSprite.png" class="ui-li-icon">Three</a></li>
    ...

 <ul data-role="listview" class="iconList">
    <li data-icon="false"><a href="#profile" data-transition="slide"><img src="img/brands/icon_one.png" /><h3>One</h3></a></li>
    <li data-icon="false"><a href="#profile" data-transition="slide"><img src="img/brands/icon_two.png" /><h3>Two</h3></a></li>
    <li data-icon="false"><a href="#profile" data-transition="slide"><img src="img/brands/icon_three.png" /><h3>Three</h3></a></li>
    ...

第一个列表有过滤器，它应该过滤第一个和第二个列表。

感谢您的帮助！

Answer 1

两者都是单独的列表。 data-filter="true" 仅用于在一个列表中进行过滤，设置它的位置。
你能做的也许是黑客攻击。将 data-filter=true 放在两者中。然后在刷新列表后，隐藏第二个列表上的过滤器。 （显示：无）。现在放置一个事件处理程序，该处理程序在第二个过滤器字段上输入任何您在顶部输入的内容。
这将起作用，但不推荐。我建议不要使用 data-filter="true" 来实现你自己的过滤机制。
或者只是将数据过滤器放在顶部，然后将这些元素隐藏在第二个列表中，这些元素在第一个列表中被隐藏。