jquery mobile：顯示多個數據過濾器

我正在嘗試在jquery-mobile中創建一個listview控件，該控件具有某些列表項目展開和顯示子項目的功能。我的目標是這個列表是可過濾的，而jquery-mobile data-filter =「true」屬性就足夠了。不幸的是，它似乎被內部的<和< o元素繼承，並且我最終得到了多個過濾器控件。有沒有最好的做法來防止這種類型的jQuery繼承？使用jquery刪除無關的表單標籤是一種有效的黑客行爲，但我寧願按照設計做。jquery mobile：顯示多個數據過濾器

下面是一個簡單的例子：

<div data-role="content"> 
    <div class="choice_list"> 
    <h2>Select an item</h2><br /> 
    <ul data-role="listview" data-inset="true" data-filter="true"> 
     <li><a>Item</a></li> 
     <li data-role="collapsible"> 
     <h3>Super Item</h3> 
     <ul data-role="listview" data-inset="true"> 
      <li><a>Sub Item</a></li> 
     </ul> 
     </li> 
    </ul> 
    </div> 
</div>

請看一看這個的jsfiddle爲例：http://jsfiddle.net/harlomic/SsJjS/3/。

來源

2012-03-13 TahoeWolverine

你可以使用CSS來隱藏兩個三個濾的輸入：

/*hide all of the search filter forms*/ 
#test .choice_list form.ui-listview-filter { 
    display : none; 
} 

/*show just the first search filter form*/ 
#test .choice_list form.ui-listview-filter:nth-child(-n+3) { 
    display : block; 
}

這裏是一個演示：http://jsfiddle.net/SsJjS/5/

注意test是該列表視圖頁面的ID找到並choice_list是您的列表視圖的容器元素的類。

來源

2012-03-13 17:38:58 Jasper

謝謝你的回答，Jasper，很高興知道如何用CSS隱藏過濾器。我仍在尋找防止將過濾器添加到DOM的最佳做法。 – TahoeWolverine 2012-03-13 23:36:49

我相信你已經偶然發現了一個bug。我從來沒有像這樣使用過嵌套列表，但是當應用數據過濾器時，jQuery Mobile似乎並不瞭解嵌套和非嵌套列表視圖之間的區別。 – Jasper 2012-03-14 00:04:47

我也遇到了與JQM中的嵌套列表相同的問題。

我搞砸了，如果你從你額外的< ul>中刪除data-role =「listview」，那麼你將會失去你的JQM樣式，那不是你所要的尋找。我們都希望JQM的光滑佈局和造型。

JQM應該解決這個問題，因爲我也覺得這可能是一個錯誤，因爲我沒有在文檔中找到任何關於此的東西。

來源

2012-04-17 23:04:48 ngChris

感謝您的迴應，cshu。這與我的經歷基本相同。 – TahoeWolverine 2012-04-24 20:32:21

jquery mobile：顯示多個數據過濾器

回答

相關問題