Question

例如：点击首页时，必须查看@Url.Action("Information", "Admin")，当点击menu1时，必须查看@Url.Action("Information1", "Admin1")。

<div class="container">

  <ul class="nav nav-tabs">
    <li class="active"><a data-toggle="tab" href="#home">Home</a></li>
    <li><a data-toggle="tab" href="#menu1">Menu 1</a></li>
    <li><a data-toggle="tab" href="#menu2">Menu 2</a></li>
    <li><a data-toggle="tab" href="#menu3">Menu 3</a></li>
  </ul>

  <div class="tab-content">
    <div id="home" class="tab-pane fade in active">
        @Url.Action("Information", "Admin")
        </div>
    <div id="menu1" class="tab-pane fade">
        @Url.Action("Information1", "Admin1")
       </div>
    <div id="menu2" class="tab-pane fade">
        @Url.Action("Information2", "Admin2")
    </div>
    <div id="menu3" class="tab-pane fade">
        @Url.Action("Information3", "Admin3")
      </div>
  </div>
</div>

Answer 1

如果您已经为每个选项卡呈现了HTML，并且您只是希望在页面上显示/隐藏它们（使用某些JavaScript确实使用了Bootstrap），则可以使用tab-content div。

在您的情况下，您实际上想要显示不同的页面，因此您应该添加只是＆＃39; nav-tabs＆＃39; HTML到每个页面，而在hrefs中使用@Url.Action。

<ul class="nav nav-tabs">
    <li class="active"><a href="@Url.Action("Information", "Admin")">Home</a></li>
    <li><a href="@Url.Action("Information", "Admin1")">Menu 1</a></li>
    <li><a href="@Url.Action("Information", "Admin2")">Menu 2</a></li>
    <li><a href="@Url.Action("Information", "Admin3")">Menu 3</a></li>
  </ul>

您需要手动控制＆＃34;活动＆＃34;每页li上的课程。

如果您执行实际上想要预呈现HTML以便全部显示在一个页面中，那么您应该渲染一组局部视图，而不是在问题中使用Url.Action改为使用Html.RenderPartial。

如何在引导选项卡中重定向到另一个视图？

1 个答案: