jQuery Mobile的可搜索列表與分頻器也可摺疊？

Question

即時通訊使用與除法的jQuery Mobile的搜索過濾器： http://jquerymobile.com/test/docs/lists/lists-search-with-dividers.html

我需要分隔在這裏崩潰，點擊時uncollapse它們下面的列表項，如例子：http://jquerymobile.com/test/docs/content/content-collapsible.html

我知道jQuery Mobile的可以處理可摺疊div很容易，但它可以與我的列表結合，或者我需要寫一些自定義jQuery來做到這一點？

Answer 1

不知道你是否已經解決了這個問題。但我有一些爲我工作的東西如下。這是我第一次在這裏回答問題。我從這個論壇中受益匪淺，所以覺得應該放棄，如果可以的話。

這是我第一次做Jquery Mobile，所以解決方案可能不是最好的。但它爲我工作：

// Build up the divider programatically. 
var listHTML = "<ul data-role='listview' data-filter='true'"; 
listHTML += "<li data-icon='arrow-u' class='ui-btn-icon-left'>"; 
listHTML += "<a class='cl-CategoryDivider' id= 'id-Category"; 
listHTML += categoryCounter; 
listHTML += "' > "; 
listHTML += CategoryName; 
listHTML += "</a>";       
listHTML += "</li>";        

// The listview must have this class 
listHTML += "<li class='cl-Category"; 
listHTML += categoryCounter; 
listHTML += "'> "; 

....................... 

然後，讓下面的代碼來處理分頻器的點擊崩潰，uncollapse是分隔符下面的項目：

$('.cl-CategoryDivider').live ("click", function (event) 
{ 
var ID = this.id.substring(this.id.indexOf("y")+1,this.id.length); 
var $span = $(this).parents("li").find ("span.ui-icon"); 
if ($span.hasClass ("ui-icon-arrow-u")) 
{ 
    $(".cl-Category"+ID).hide(); 
    $span.removeClass ("ui-icon-arrow-u"); 
    $span.addClass ("ui-icon-arrow-d"); 
} else { 
    if ($span.hasClass ("ui-icon-arrow-d")) 
    { 
     $(".cl-Category"+ID).show(); 
     $span.removeClass ("ui-icon-arrow-d"); 
     $span.addClass ("ui-icon-arrow-u"); 
    } 
} 
}); 

希望它能幫助。