我有一个使用 ul 和 li 的导航菜单。我可以填充它,但一旦发生回发或移动到新页面,它就无法记住其状态。
这是代码:
Masterpage.Master
<ul id="main-nav">
<li>
<a href="MPTest2.aspx" class="nav-top-item" runat="server">
Employees
</a>
<ul id="mgList" runat="server" >
</ul>
</li>
</ul>
MasterPage.Master.cs
protected void Page_Load(object sender, EventArgs e)
{
DataTable dt = new DataTable();
SqlConnection connection = new SqlConnection(@"Data Source= localhost;Initial Catalog=ServerDb;Integrated Security=True");
connection.Open();
SqlCommand sqlCmd = new SqlCommand("select EmpName, EmpID from Employee order by EmpName", connection);
SqlDataAdapter sqlDa = new SqlDataAdapter(sqlCmd);
sqlDa.Fill(dt);
connection.Close();
if (dt.Rows.Count > 0)
{
HtmlGenericControl li;
for (int j = 0; j < dt.Rows.Count; j++)
{
li = new HtmlGenericControl("li");
HtmlAnchor a = new HtmlAnchor();
a.HRef = "~/MPTest1.aspx?MGID=" + Convert.ToInt32(dt.Rows[j]["EmpID"]);
a.InnerText = dt.Rows[j]["EmpName"].ToString();
li.Controls.Add(a);
mgList.Controls.Add(li);
}
}
}
JQuery:
$(document).ready(function(){
//Sidebar Accordion Menu:
$("#main-nav li ul").hide(); // Hide all sub menus
$("#main-nav li a.nav-top-item").click( // When a top menu item is clicked...
function() {
$(this).parent().siblings().find("ul").slideUp("normal"); // Slide up all sub menus except the one clicked
$(this).next().slideToggle("normal"); // Slide down the clicked sub menu
return false;
}
); }
现在我知道 hide() 函数隐藏了第一次需要调用的所有菜单。但之后我需要一个类或函数来记住菜单的状态(如果它是打开的)而不是折叠所有内容。
如果我能得到一些建议或一些例子,那就太好了。
谢谢
最佳答案
我知道这并不完全是您正在寻找的东西,但它是我用来跟踪我的菜单/子菜单事件的东西。我相信您应该能够使用我在下面提供的前提来显示正确的菜单项。我也可能不理解这个问题,如果是这样,请告诉我,我会尽力提供进一步的帮助。下面的示例与 Razor MVC3 一起使用。
我还想指出,我将此代码限制为两级菜单,如果您使用更多级别的菜单,则应该修改代码以使其递归更加稳健。
$(function () {
$("#menu li a[href='@Request.Url.LocalPath'],#menu li a[href='@(Request.Url.PathAndQuery)']").parent("li").addClass("current_page_item");
$("li.current_page_item").parent("ul").parent("li").addClass("current_page_item");
});
在您下面评论的主题中,我相信您可以做类似以下的事情,虽然并不完美,但可能会给您一个正确方向的开始。
[WebMethod]
public static string MarkOpened(string id)
{
HttpContext.Current.Session["currentPage"] = id
}
$(document).ready(function(){
$("#main-nav li a.nav-top-item:<%= HttpContext.Current.Session["currentPage"] %>").next().slideToggle("normal");
$("#main-nav li a.nav-top-item").click(function(){
$.ajax({
type: "POST",
url: location.href + "/MarkOpened",
contentType: "application/json; charset=utf-8",
data: "{ 'id':'" + $(this).attr("something") + "'}",
dataType: "json"
});
};
); }
关于c# - 使用 <ul> 进行导航(无法记住状态),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7654672/