@Html.ActionLink 重载方法的片段部分，用于链接到选项卡式页面的一部分

Question

我正在开发一个 ASP.NET 的MVC Web应用程序。

在我的一个页面上，我用标签标记了如下所示的信息：

选项卡式内容

我的动作链接如下所示：

@Html.ActionLink("Back to Details", "RecordView", "ApplicantRecords", null, null, "Documents", new { id = Model.InternID }, null)

现在，当我

将鼠标悬停在我的应用程序中的链接上时，它具有带有InternID和片段的正确语法，但是当我单击它时，它会将我发送到显示"申请人个人资料"的选项卡，而不是"文档"。

当我将鼠标悬停在"文档"选项卡上时，它的网址与我将操作链接悬停在应用程序中时的网址相同。

有没有办法解决这个问题？

Answer 1

除了克里斯·帕特的回答。

您需要显式启用所需的特定选项卡。

首先，您需要在 url 查询字符串中再传递一个参数来表示要选择的选项卡。

@Html.ActionLink("Back to Details", "RecordView", "ApplicantRecords", 
                                       new { id = Model.InternID ,tab="documents" }, null)

在您的RecordView()操作方法中，您将接受这一点，将其设置为 ViewBag，以便您可以在剃须刀视图中阅读它。

public ActionResult RecordView(int id,string tab="profile")
{ 
  ViewBag.CurrentTab = tab;
  return View();
}

在您看来，在 文档ready事件 ，我们将读取此值并使用它来显示特定选项卡。

$(function() {
    var tab = "@ViewBag.CurrentTab";
    $('.nav-tabs a[href=#'+tab+']').tab('show');
});

假设选项卡链接的 href 值"#profile"且"#documents"

<ul class="nav nav-tabs" role="tablist">
    <li role="presentation" class="active">
       <a href="#profile" aria-controls="Profile" role="tab" data-toggle="tab">Profile</a>
   </li>
    <li role="presentation">
      <a href="#documents" aria-controls="documents" role="tab" data-toggle="tab">Docs</a>
    </li>
</ul>

Answer 2

简单地将片段附加到 URL 不会对激活特定选项卡执行任何操作。 JavaScript "选项卡"库仅利用片段进行优雅降级：如果未启用 JavaScript，单击"选项卡"将跳转到页面内容所在的右侧部分，因为页面锚点的工作方式。但是，您有责任检查 URL 中的片段（如果存在），并激活相应的选项卡。如何激活选项卡取决于您的特定解决方案，但是您尚未向我们提供任何信息。