0

jQuery Breaks in MVC4

I have jQuery, jQuery Mobile and jQuery-UI included in my MVC4 project. I am having a problem where the jQuery-UI script only loads if the page is refreshed, otherwise the jQuery-UI will not load initially.

I have tried moving the include script to the bottom of the page instead of including it in the top. This seems to work 80% of the time with one side effect. When I post some data to the server, I would get two posts instead of one.. ugh! I seem to be stuck and I can find anything on Google that will help alleviate my problem. Any help or guidance will be appreciated.

Thanks!

Here is some added code

Here is my _layout.cshtlm

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>@ViewBag.Title - My ASP.NET MVC Application</title>
        <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
        <link href="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/Content/css")" rel="stylesheet" type="text/css" />
        <link href="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/Content/themes/base/css")" rel="stylesheet" type="text/css" />
        <link type="text/css" href="~/Content/jquery-ui-1.8.21.custom.css" rel="stylesheet" />
        <script src="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/Scripts/js")" type="text/javascript"></script>
        <script src="@Url.Content("http://code.jquery.com/jquery-latest.js")" type="text/javascript"></script>              

        <script src="@Url.Content("~/Scripts/jquery-ui-1.8.21.custom.min.js")" type="text/javascript"></script>  
        <script src="@Url.Content("~/Scripts/jquery.multi-accordion-1.5.3.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/Scripts/myjQuery.js")" type="text/javascript"></script>   
        <meta name="viewport" content="width=device-width" />
    </head>
    <body>
    <div>

        <header>
        <script>
        </script>
            <div class="content-wrapper wrappingBorder bottomRound shadow" style="background-color:White;margin:0 auto 30px auto;">
                <div class="float-left">
                    <p class="title">NTI Project Management</p>
                </div>
                <div class="float-right">
                  @*<section id="login">
                        @Html.Partial("_LoginPartial")
                    </section>*@
                        <nav>
                            <ul id="menu">
                                <li >@Html.ActionLink("Home", "Index", "Home")</li>
                                <li>@Html.ActionLink("Projects", "Index", "Project")</li>
                                <li>@Html.ActionLink("Profile", "Contact", "Home")</li>
                                <li>@Html.ActionLink("Logout", "Index", "Logout")</li>
                            </ul>
                        </nav>
                </div>
            </div>
        </header>

        @*Start of main content*@
        <div id="body">
            <section class="content-wrapper main-content clear-fix allRound shadow">
                @RenderBody()
            </section>
        </div>
        <footer>
            <div class="content-wrapper">
                <div class="float-left">
                    <p style="font-size: 14px">&copy; @DateTime.Now.Year - 3M</p>
                </div>
            </div>
        </footer>
        </div>   

    </body>     
</html>
4

2 回答 2

1

我会先尝试删除捆绑，看看是否存在加载顺序问题。看起来您正在捆绑 scripts/js 文件夹并在 jquery 和 jquery.ui 之前加载它，这可能是问题吗？

于 2012-07-20T13:15:58.003 回答
1

听起来你在加载 JQ lib 之前加载 JQUI 等

尝试在 _layout/master 页面的头部按以下顺序移动它：

  • 江青
  • 杰奎
  • 其他

或者，确保您只调用每个库一次，并使用两个库的最新版本： - JQ：1.7.1 - JQUI：1.8.21

此外，请仔细检查这些库是否真的“存在”。进入 View Source > Head > 单击每个脚本的 URL 以查看您是否在 MVC 中指定了错误的位置。（有时在错误使用 Content.URL/URL.Action 时会发生）

由于浏览器缓存，它可能会在您第二次刷新时加载

就双贴而言，如果检查上述后仍然存在，显示一些代码也将帮助我们帮助您

于 2012-07-20T12:21:37.940 回答