如何在中繼器中隱藏/顯示？

Question

我正在嘗試在錨點單擊上隱藏/顯示div ，但這不起作用。

我有轉發器，並且其中有很多帖子。 有綁定的圖像，描述和注釋（錨標記）。

當我單擊評論時，將顯示關聯的div 。

<a href="#" onclick="$('#<%= divSearch.ClientID%>').toggle('medium');return false;">Show Search</a>
<div class="widget-content" id="divSearch" runat="server" style="display: none; background-color: #EEEEEE;">Content goes here</div>

它可以在轉發器項目模板外部完美地工作，但是當我將其放置在轉發器內部時，它將無法正常工作

Answer 1

給出的其他2個答案忘記了在Repeater中有一個以上的divSearch ，因此您無法直接在aspx中訪問它們。 為此，您需要使用FindControl，可以內聯完成。 您必須在容器內找到面板，並獲取該ClientID。

<asp:Repeater ID="Repeater1" runat="server">
    <ItemTemplate>

        <asp:Panel ID="divSearch" runat="server" style="display:none">
            <%# Eval("value") %>
        </asp:Panel>

        <a href="#" onclick="$('#<%# Container.FindControl("divSearch").ClientID %>').toggle('medium');return false;">Show</a>

    </ItemTemplate>
</asp:Repeater>

Answer 2

我認為實現此目的的最簡單方法是在ItemDataBound事件中。

標記

<a href="#" runat="server" id="showSearch">Show Search</a>
<div class="widget-content" id="divSearch" runat="server" style="display: none; background-color: #EEEEEE;">Content goes here</div>

事件

protected void repeater_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
    if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
    {
        var link = e.Item.FindControl("showSearch") as HtmlControl;
        link.Attributes["onclick"] = $"$('{e.Item.FindControl("divSearch").ClientID}').toggle('medium'); return false;";
    }
}

Answer 3

在模板控件中，您需要使用<%#而不是<%= ：

<a href="#" onclick="$('#<%#Container.FindControl("divSearch").ClientID%>').toggle('medium');return false;">Show Search</a>