引导导航选项卡未加载正确的页面
Posted
技术标签:
【中文标题】引导导航选项卡未加载正确的页面【英文标题】：Bootstrap nav-tabs not loading proper page 【发布时间】：2021-07-14 05:01:55 【问题描述】：经过多次反复试验和搜索，我求助于寻求帮助，因为我现在不知道我的问题是什么。我有一个 MVC 站点，我正在尝试使用并设法让导航选项卡在屏幕上工作，但它们不会在视图之间切换，因此不会加载我想要显示的内容。我没有收到任何错误，但即使在尝试了显示的两个 href 设置后，我也没有得到正确的内容。 下面是我的 _layout.cshtml 页面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="container">
<ul class="nav nav-tabs nav-justified">
<li class="nav-item"><a class="nav-link active" href="#home" data-toggle="tab">Home</a></li>
<li class="nav-item"><a class="nav-link" href="~/Views/Home/Itinerary.cshtml" data-toggle="tab">Itinerary</a></li>
</ul>
</div>
<div class="container body-content">
@RenderBody()
<hr />
</div>
<script src="~/Scripts/jquery-3.4.1.slim.min.js"></script>
<script src="~/Scripts/popper.min.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
<script src="~/Scripts/bootstrap.js"></script>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
</body>
</html>
@
ViewBag.Title = "Index";
<br />
<h2>@ViewBag.Title.</h2>
<h3>@ViewBag.Message</h3>
<p>Home</p>
@
ViewBag.Title = "Itinerary";
<br />
<h2>@ViewBag.Title.</h2>
<h3>@ViewBag.Message</h3>
<p>Use this area to provide additional information.</p>
public class HomeController : Controller
public ActionResult Index()
return View();
public ActionResult Itinerary()
ViewBag.Message = "Your application description page.";
return View();
public ActionResult Contact()
ViewBag.Message = "Your contact page.";
return View();
如果有帮助，这也适用于 Bootstrap 4.6。
【问题讨论】：
我想您正试图从控制器的选项卡内动态加载数据？ 【参考方案1】：您应该使用 href="/Controller/Action?Id=parameter"。
你的情况：href="/Home/Itinerary"
【讨论】：
【参考方案2】：<a href="~/ContollerName/ViewName">
//your code
<li class="nav-item"><a class="nav-link" href="~/Home/Itinerary" data-toggle="tab">Itinerary</a></li>
您也可以使用它。如果没有参数，则删除新的 para。
a href="@Url.Action("ActionName","ControllerName", new Para1 = "", Para2 = "")"
【讨论】：
以上是关于引导导航选项卡未加载正确的页面的主要内容，如果未能解决你的问题，请参考以下文章