如何通過單擊ItemTemplate來擴展ListView的ItemTemplates的內容？

Question

我有一個ListView與ItemTemplates號碼。每個ItemTemplate中都有一個Repeater，顯示了每個ItemTemplate（即類別）中的文件列表。目前，所有類別中的所有文件都是可見的。但我只想顯示類別，並通過點擊每個類別，展開它並顯示該類別中的文件。

我該怎麼做？

下面是我當前的代碼：

<asp:ListView runat="server" ID="lvDownloadFilesViewer"> 
    <ItemTemplate> 
     <div class="downloadList-Headline"> 
      <%#Eval("Title")%> 
     </div> 

     <div class="downloadList"> 
      <ul>     
       <asp:Repeater ID="Repeater1" runat="server" EnableViewState="false"  DataSource='<%# DataBinder.Eval(Container.DataItem, "DownloadFilesItemList") %>'>     

       <ItemTemplate>          
        <li style="width:100%"> 
         <div class="FileDescription"><%# DataBinder.Eval(Container.DataItem, "Description")%> 
         </div>        
        </li> 
       </ItemTemplate> 

       </asp:Repeater> 
      </ul> 
     </div> 
    </ItemTemplate> 
</asp:ListView> 

Answer 1

使用本：

<style> 
    .downloadList 
    { 
     display: none; 
    } 
    .downloadList-Headline 
    { 
     cursor: pointer; 
    } 
</style> 
<script> 
    $(document).ready(function() { 
     $('.downloadList-Headline').click(function() { 
      $(this).next().toggle('medium'); 
     }); 
    }); 
</script> 
<asp:ListView runat="server" ID="lvDownloadFilesViewer"> 
    <ItemTemplate> 
     <div class="downloadList-Headline"> 
      [+] <%#Eval("Title")%> 
     </div> 
     <div class="downloadList"> 
      <ul> 
       <p></p> 
       <asp:Repeater ID="Repeater1" runat="server" EnableViewState="false" DataSource='<%# DataBinder.Eval(Container.DataItem, "DownloadFilesItemList") %>'> 
        <ItemTemplate> 
         <li style="width:100%"> 
         <div class="FileDescription"><%# DataBinder.Eval(Container.DataItem, "Description")%></div> 
         <a href="<%#Page.ResolveClientUrl((string)Eval("FilesPath")) %>" class="<%# DataBinder.Eval(Container.DataItem, "FilesTypeTitle")%>" 
        target="_blank"> 
        <%# DataBinder.Eval(Container.DataItem, "FilesTitle")%></a> 
        </li> 
        </ItemTemplate> 
       </asp:Repeater> 
      </ul> 
     </div> 
    </ItemTemplate> 
</asp:ListView>