0

我创建了一个MVC3的测试项目，该项目只有一个剃须刀布局。在布局中我使用jquery创建动态菜单，我只想得到效果是当我点击这些菜单时，它应该在正文段中返回不同的局部视图，并且布局菜单应该记住我点击布局的菜单状态页。

但结果是，每次点击菜单，布局都会重新渲染，菜单状态又恢复了，请问怎么解决？

这是我的代码！！！任何人都可以帮助我吗？谢谢！

            <!DOCTYPE html>
            <html>
            <head>

                <title>@ViewBag.Title</title>
                <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
                <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
                <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
                <script type="text/javascript">
                    $(function () {
                              $(".sidebar1 dl dd").hide();
                              $(".sidebar1 dl dt").click(function () {
                              $(".sidebar1 dl dd").not($(this).next()).hide();

                              $(this).next().slideToggle(500);

                        });
                    });

            </script>

            </head>
            <body>
            <div class="container">
              <div class="header"><a href="#"><img src="/Content/images/logo.png" alt="logo" name="Insert_logo" width="180" height="90" id="Insert_logo" style="background-color: #C6D580; display:block;" /></a>

                <!-- end .header --></div>
              <div class="sidebar1">

                <dl class="nav">
                  <dt><a href="#">aaaaa</a></dt>
                    <dd>
                        <ul>
                      <li><a href="#">AAAA</a></li>
                          <li><a href="#">BBBB</a></li>
                          <li><a href="#">CCCC</a></li>

                        </ul>
                    </dd>
                  <dt><a href="#">aaaaa</a></dt>
                    <dd>
                        <ul>
                      <li><a href="#">AAAA</a></li>
                          <li><a href="#">BBBB</a></li>
                          <li><a href="#">CCCC</a></li>

                        </ul>
                    </dd>
               </dl>
            </div>
            <div class="content">

            @RenderBody()
            </div>

            </body>
            </html>
4

2 回答 2

0

如果需要，您可以指定每个页面上使用的布局。如果您不想要布局，只需将其设置为 null。把它放在页面顶部：

@{
  layout = null
}
于 2012-05-23T08:09:36.527 回答
0

用户，

你在哪里：

<div class="content">

您需要将其更改为：

<div id="content">

然后，您需要定位您的部分视图以更新该 div。这意味着您的控制器操作应该返回 PartialView()，而不是 View()。此外，无需担心上述任何问题，您只需尝试将点击功能更改为：

$(function () {
    $(".sidebar1 dl dd").hide();
    $(".sidebar1 dl dt").click(function (e) {
        $(".sidebar1 dl dd").not($(this).next()).hide();

        $(this).next().slideToggle(500);
        e.preventDefault();
        return false;
    });
});

由于您没有显示 ajax 代码，因此可能需要更多，但我敢打赌，如果您在 ajax 调用中遵循标准，那么这一切都会通过上述更改自行解决。

于 2012-05-23T08:44:23.703 回答