Asp.net mvc 3 如何隐藏jQuery选项卡直到经过身份验证，并在MVC3中进行身份验证后添加或显示它们？
摘要 我目前正在尝试使用MVC3体系结构和jQueryUI控件构建一个Web应用程序。到目前为止，我已经能够显示选项卡并在其中导航 现在，我可以让登录页面显示在我的第一个选项卡上，因为这是此应用程序的第一个必需操作 一旦认证，我想能够添加一些其他选项卡，允许使用这个应用程序 该应用程序是关于一个电话簿列表，其中包含已知的人的邮寄地址 也就是说，此应用程序的工作流程将是：Asp.net mvc 3 如何隐藏jQuery选项卡直到经过身份验证，并在MVC3中进行身份验证后添加或显示它们？,asp.net-mvc-3,jquery-ui,partial-views,jquery-ui-tabs,Asp.net Mvc 3,Jquery Ui,Partial Views,Jquery Ui Tabs,摘要 我目前正在尝试使用MVC3体系结构和jQueryUI控件构建一个Web应用程序。到目前为止，我已经能够显示选项卡并在其中导航 现在，我可以让登录页面显示在我的第一个选项卡上，因为这是此应用程序的第一个必需操作 一旦认证，我想能够添加一些其他选项卡，允许使用这个应用程序 该应用程序是关于一个电话簿列表，其中包含已知的人的邮寄地址 也就是说，此应用程序的工作流程将是： 首次到达现场时进行认证 如果用户尚未注册，应用程序应允许该用户一次性注册，使用相同的jQuery UI选项卡，或者显示新的注册
public class HomeController : Controller {
public ActionResult Index() { return View(); }
public ActionResult SelectTab(int id) {
switch (id) {
case 0: return RedirectToAction("Register", "Account");
default: return RedirectToAction("LogOn", "Account");
}
}
}
public class AccountController {
public ActionResult LogOn() { return PartialView(new LogOnModel()); }
public ActionResult Register() { return PartialView(new RegisterModel()); }
}
public class HomeController : Controller {
public ActionResult Index() { return View(); }
public ActionResult SelectTab(int id) {
switch (id) {
case 0: return RedirectToAction("Register", "Account");
default: return RedirectToAction("LogOn", "Account");
}
}
}
public class AccountController {
public ActionResult LogOn() { return PartialView(new LogOnModel()); }
public ActionResult Register() { return PartialView(new RegisterModel()); }
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/south-street/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js" type="text/javascript"></script>
<script>
$(window).load(function () {
$("#tabs").tabs({ select: function (event, ui) { selectTab(getSelectedTab()); } });
logIn();
});
function logIn() {
selectTab(-1);
selectTab(0);
}
function selectTab(index) {
var url = '@Url.Content("~/Home/SelectTab/")' + index;
var targetDiv = "#tab" + index;
$.get(url, null, function(result) { $(targetDiv).html(result); });
}
function getSelectedTab() { return $("#tabs").tabs("option", "selected"); }
function setSelectedTab(index) { $("#tabs").tabs("option", "selected", index); }
</script>
</head>
<body>
<div id="tabs">
<ul id="menu">
<li><a href="#tab0"><span>Authenticate</span></a></li>
@if (Request.IsAuthenticated) {
<li><a href="#tab1"><span>About</span></a></li>
}
</ul>
<div id="tab0"></div><div id="tab1"></div>
</div>
@RenderBody()
</body>
@视图包。标题
$（窗口）。加载（函数（）{
$（“#tabs”）.tabs（{select:function（event，ui）{selectTab（getSelectedTab（））；}}）；
登录（）；
});
函数登录（）{
选择标签（-1）；
选择选项卡（0）；
}
功能选择选项卡（索引）{
var url='@url.Content（“~/Home/SelectTab/”）+索引；
var targetDiv=“#tab”+索引；
$.get（url，null，函数（结果）{$（targetDiv.html（结果）；}）；
}
函数getSelectedTab（）{return$（“#tabs”）.tabs（“option”，“selected”）；}
函数setSelectedTab（index）{$（“#tabs”）.tabs（“选项”，“选定”，索引）；}
@如果（请求已验证）{
}
@RenderBody（）
也许隐藏实际选项卡并显示另一个用于注册的选项卡会更简单？但是，如何实现这一点呢？*我建议通过ajax加载每个其他选项卡（登录除外）。您可以通过ajax从提交登录，并在成功响应时销毁登录选项卡，然后动态添加一个新选项卡，并将href设置为ajax操作 你可以完成你想做的事情，但是它需要大量的jquery和ajax（我建议你试试）。服务器端是最简单的部分
我认为不使用SelectTab开关直接调用操作也更好 你在登录后刷新页面吗？我想如果这是可行的，我也许可以避免它。+1谢谢你的提示。另外，我有工业和框架背景，所以我不熟悉AJAX和所有不同的Web技术。我在你的链接后读到了关于淘汰赛的消息，我肯定会尝试一下。此外，我认为jQuery和jQueryUI是ASP.NETMVC的领先技术，所以我想我会尝试这项艰苦的工作，这样我就可以学习“艰苦的方法”，所以一旦完成，我会完全理解为了达到我想要的目的我必须使用的一切。我开始谦卑地相信，我已经吃不下了。如果你想做我想做的事情，你的代码会是什么样子？由于“世界”正在向它转变，我希望在开发Web应用程序方面做得更好，因此我非常感谢一些入门指南。提供一个获得期望目标的例子，你肯定会得到一个公认的答案。我向你发誓。谢谢你的好意和帮助！