Twitter Bootstrap 选项卡，带有 runat 服务器的 href答案

【问题标题】：Twitter Bootstrap tabs, a href with runat serverTwitter Bootstrap 选项卡，带有 runat 服务器的 href
【发布时间】：2014-04-29 13:38:39
【问题描述】：

我成功地使用了 twitter bootstrap 的标签。但是，一旦我将列表项的内部 href 更改为 runat="server"，它就会失去选项卡功能。

<ul id="tab" class="nav nav-tabs">
    <li id="liItemInfo" runat="server"><a href="#<%=tbItemInfo.ClientID %>" data-toggle="tab">Item Information</a></li>
    <li id="liDocuments" runat="server"><a id="lnkDocuments" runat="server" href="#<%=tbDocuments.ClientID %>" data-toggle="tab">Documents (0)</a></li>
    <li id="liHistory" runat="server"><a href="#tbHistory" data-toggle="tab">History</a></li>
</ul>

所以在上面的例子中，第一个和第三个选项卡正在工作，但不是第二个，即。如果你点击它，什么也不会发生。我需要它在服务器上可用的原因是设置上传的文档数量。我可以做些什么来让它工作吗？

【问题讨论】：

为了帮助您解决这个问题，我们需要查看浏览器接收到的 HTML，而不是服务器端代码。
href click problem if i add runat="server" attribute in asp.net 的可能重复项

标签： jquery asp.net twitter-bootstrap webforms tabs

【解决方案1】：

正如 Sjoerd 所逃避的，这似乎是与href click problem if i add runat="server" attribute in asp.net 类似的问题

为了让它工作，我用 asp:hyperlink 替换了 a href，如下所示：

<ul id="tab" class="nav nav-tabs">    
    <li id="liItemInfo" runat="server"><asp:HyperLink ID="lnkItemInfo" runat="server" NavigateUrl="#tbItemInfo" data-toggle="tab">Item Information</asp:HyperLink></li>
    <li id="liDocuments" runat="server"><asp:HyperLink ID="lnkDocuments" runat="server" NavigateUrl="#tbDocuments" data-toggle="tab">Documents (0)</asp:HyperLink></li>    
    <li id="liHistory" runat="server"><asp:HyperLink ID="lnkHistory" runat="server" NavigateUrl="#tbHistory" data-toggle="tab">History</asp:HyperLink></li>
</ul>

【讨论】：