单击水平主菜单时在页面左侧显示子菜单；显示/隐藏 div 错误答案

【问题标题】：Displaying submenu on left side of page when the horizontal main menu is clicked;show/hide div error单击水平主菜单时在页面左侧显示子菜单；显示/隐藏 div 错误
【发布时间】：2011-12-29 20:08:01
【问题描述】：

我一直在尝试显示水平主菜单，单击主菜单中的项目时，子菜单将垂直显示在页面左侧。这是母版页。

<div id="middlebar">
   <ul class="menu">                          
     <li><%= Html.ActionLink("Home", "Index", "Home")%></li>
     <li id="lnkConfiguration" ><%= Html.ActionLink("Configuration", "Index", "User")%>/li>
     <li><%= Html.ActionLink("Application Authentication",  "Index",ApplicationAuthentication")%></li>
     <li id="lnkUserAuthentication"><%= Html.ActionLink("User Authentication", "Index",  "UserAuthentication")%></li>
     <li><%= Html.ActionLink("About", "About", "Home")%></li>
  </ul>                   
</div> 
<div>
 <table width="100%">
     <tr valign="middle">
      <td style="width:150px" >
        <div id="divConfiguration" >
           <%Html.RenderPartial("SubMenuConfiguration"); %>
        </div>
      </td>
      <td><asp:ContentPlaceHolder ID="MainContent" runat="server" /></td>
     </tr>
   </table>
 </div>

我试图隐藏子菜单，直到单击主菜单。这是脚本：

<script language="javascript" type="text/javascript">
$(document).ready(function() {
  $("#divConfiguration").hide();
     $('#lnkConfiguration').click(function() {
     $('#divConfiguration').show(); //.toggle(400);                     
     });
   })                      
 </script>

但是，发生的情况是，当单击配置菜单并且页面指向控制器时会出现子菜单。一旦加载页面，子菜单就会消失。发生这种情况是因为在单击配置选项卡后页面重新加载后脚本会再次运行。为了解决这个问题，我可能需要设置一些东西来表明我在配置页面上，这样子菜单就不会被隐藏。但是，我不知道在哪里设置值。是否在用户控制器索引操作中？如果是，我如何将值传递给母版页单击事件？有什么建议吗？

【问题讨论】：

标签： jquery asp.net-mvc menu

【解决方案1】：

我以前从未使用过 asp，如果出现错误，很抱歉，但这将停止加载链接并改为打开 div。如果您需要加载链接以便在#divConfiguration 中包含内容，那么我建议您使用ajax。

$(document).ready(function() {
    $("#divConfiguration").hide();
    $('#lnkConfiguration').click(function(e) {
        e.preventDefault();
        $('#divConfiguration').show(); //.toggle(400);                     
    });
});

ajax: 做一个页面只显示接收到post变量后的div配置

        $.ajax({
            type: 'POST',
            url: 'divconfiguration.asp',
            data: 'page='$(this).attr('href'),
            success: function (msg) {
            $('#divConfiguration ').html(msg).show();
            }
        });

【讨论】：