GridView 单元格作为超链接

【问题标题】：GridView cell as hyperlinkGridView 单元格作为超链接
【发布时间】：2015-10-01 15:43:54
【问题描述】：

我在 gridview 单元格中有一个可以正常工作的超链接，但是为了改善我的用户体验，我希望整个单元格都是可点击的，而不仅仅是文本，因为在大多数情况下，文本是单个数字。

例如

<asp:TemplateField HeaderText="Qty">
    <ItemTemplate>
        <asp:HyperLink ID="Lnk" runat="server"
           NavigateUrl='<%# "View.aspx?ID=" + Eval("ID") %>'
           Text='<%# Eval("Qty") %>' />
    </ItemTemplate>
</asp:TemplateField>

如何使整个表格单元格可点击？

【问题讨论】：

标签： asp.net gridview

【解决方案1】：

你可以使用java脚本来做到这一点

<asp:TemplateField HeaderText="Qty" ItemStyle-CssClass="clickable">
    <ItemTemplate>
        <asp:HyperLink ID="Lnk" runat="server"
           NavigateUrl='<%# "View.aspx?ID=" + Eval("ID") %>'
           Text='<%# Eval("Qty") %>' />
    </ItemTemplate>
</asp:TemplateField>

如果使用 jquery

$(document).ready(function(){
    $('.clickable').on('click', function(){
         window.location.href = $(this).children('a').attr('href');
    });
});

你也可以用css来装饰你的单元格

.clickable { cursor: pointer; }

【讨论】：