Javascript 如何在jQuery/HTML中具有多个列的listview上使用数据过滤器属性？

我需要能够在我正在工作的jQuery移动站点中搜索联系人列表。它的格式为联系人图像下方的联系人名称，有两列联系人，

ui-block-a

和

ui-block-b

，如下所示：

    <div data-role="content" data-theme="c" class="ui-grid-b">      
        <ul data-role="listview" data-filter="true" data-inset="false">
        <div class="ui-block-a">
            <ul>
                <li>
                    <a href="tel:0123456789"><img src="images/personMale.png" width="100"></a>
                    <p><b>Bar, Foo</b></p>
                </li>                       
                <li>
                    <a href="tel:0123456789"><img src="images/personMale.png" width="100"></a>
                    <p><b>Santor, George</b></p>
                </li>
            </ul>
        </div>
        <div class="ui-block-b">
            <ul>
                <li>
                    <a href="tel:0123456789"><img src="images/personMale.png" width="100"></a>
                    <p><b>Sebastian, John</b></p>
                </li>
                <li>
                    <a href="tel:0123456789"><img src="images/personMale.png" width="100"></a>
                    <p><b>Foo, Bar </b></p>
                </li>
            </ul>
        </div>
      </ul>  
    </div>

酒吧，富



乔治·桑特





塞巴斯蒂安，约翰



富，酒吧

---

当前，当您搜索特定姓名时，它会显示其所在的列，而不是仅显示一个联系人，

ui-block-a

或

ui-block-b

。我尝试了一种更加手动的javascript方法，将

ui-block-a

和

ui-block-b

中的

ul

s作为搜索目标，但我基本上遇到了相同的问题。实际项目在每个块/列中约有10个联系人。感谢您的帮助。

我通过将每个联系人放入自己的

ui-block-a

和

ui-block-b

解决了这个问题。小的格式问题，但没有一点CSS不能解决