GridView内嵌GridView的显示/隐藏问题（LinkButton触发失效）

你的问题核心在于原JavaScript逻辑只监听了图片点击事件，而切换到LinkButton后，不仅事件绑定对象变了，还需要处理LinkButton默认的回发行为，同时要适配动态显隐的控件绑定方式。下面是完整的修复方案：

1. 前端ASCX结构调整 #

先给LinkButton添加统一的CSS类，方便JavaScript选择，同时保持Panel结构不变：

<asp:TemplateField HeaderText="#" ItemStyle-CssClass="col-400px" ItemStyle-Width="25px" SortExpression="QuestionNum" >
    <ItemTemplate>
        <asp:Label ID="lblQuestionNum" Font-Bold="true" runat="server" Text='<%# Bind("question_id")%>' Visible="false" ToolTip='<%#Eval("question_text")%>'></asp:Label>
        <!-- 添加CssClass用于JS选择，同时保留原有属性 -->
        <asp:LinkButton ID="linkButtonQuestionNum" runat="server" Text='<%#Bind("question_id")%>' Visible="false" CssClass="toggle-details-btn" BorderStyle-Right="None" ToolTip='<%#Eval("question_text")%>' />
        <asp:Panel ID="pnlTableQuestion" runat="server" Style="display: none">
            <asp:GridView ID="gvQuestionDetails" runat="server" AutoGenerateColumns="false" >
                <Columns>
                    <asp:BoundField ItemStyle-Width="150px" DataField="col_name" HeaderText="Column" />
                    <asp:BoundField ItemStyle-Width="150px" DataField="comments" HeaderText="Comments" />
                </Columns>
            </asp:GridView>
        </asp:Panel>
    </ItemTemplate>
</asp:TemplateField>

2. 后端RowDataBound优化 #

给LinkButton添加展开/收起的标识文本，同时确保CSS类正确赋值：

Private Sub grdChanges_RowDataBound(sender As Object, e As GridViewRowEventArgs) Handles grdChanges.RowDataBound
    Select Case e.Row.RowType
        Case DataControlRowType.DataRow
            Dim rowDat As Model.DocumentModel.DocChangeHistory = DirectCast(e.Row.DataItem, Model.DocumentModel.DocChangeHistory)
            Dim lbuttonQuestionText As LinkButton = e.Row.FindControl("linkButtonQuestionNum")
            Dim lblQuestionText As Label = e.Row.FindControl("lblQuestionNum")
            
            If rowDat.details_needed = 1 Then
                lblQuestionText.Visible = False
                lbuttonQuestionText.Visible = True
                ' 添加CSS类和展开标识（▶）
                lbuttonQuestionText.CssClass = "toggle-details-btn"
                lbuttonQuestionText.Text = "▶ " & lbuttonQuestionText.Text
                
                Dim QuestionId As Long = Convert.ToInt64(grdChanges.DataKeys(e.Row.RowIndex).Value)
                Dim gvQuestionDetails As GridView = TryCast(e.Row.FindControl("gvQuestionDetails"), GridView)
                Using hDal As New HistoryDAL(CurrentUserId, ProjectID)
                    gvQuestionDetails.DataSource = ' 你的数据源逻辑
                    gvQuestionDetails.DataBind()
                End Using
            Else
                lblQuestionText.Visible = True
                lbuttonQuestionText.Visible = False
            End If
    End Select
End Sub

3. 重写JavaScript逻辑 #

替换原图片监听的代码，改用事件委托处理动态控件，同时阻止LinkButton的默认回发：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    // 用事件委托绑定动态生成的LinkButton
    $(document).on("click", ".toggle-details-btn", function (e) {
        // 阻止LinkButton默认的回发行为，避免页面刷新
        e.preventDefault();
        
        var $btn = $(this);
        var $row = $btn.closest("tr");
        var $panel = $btn.next("#<%= pnlTableQuestion.ClientID %>");
        var $detailRow = $row.next(".detail-row");
        
        if ($detailRow.length > 0) {
            // 收起：移除详情行，恢复按钮文本
            $detailRow.remove();
            $btn.text($btn.text().replace("▼", "▶"));
        } else {
            // 展开：插入详情行，替换按钮文本
            var detailContent = $panel.html();
            $row.after('<tr class="detail-row"><td></td><td colspan="999">' + detailContent + '</td></tr>');
            $btn.text($btn.text().replace("▶", "▼"));
        }
    });
</script>

关键修复点说明 #

1. 事件委托替代直接绑定：因为LinkButton是动态显隐的，页面初始加载时部分控件不可见，用$(document).on()可以确保后续显示的控件也能触发事件。
2. 阻止回发行为：LinkButton默认会触发ASP.NET回发，必须用e.preventDefault()阻止，否则点击后页面会刷新，无法保留展开状态。
3. CSS类选择器：避免依赖ASP.NET生成的复杂客户端ID，用CSS类选择控件更可靠。

内容的提问来源于stack exchange，提问作者user2848099