18

ASP .NET MVC 4 WebAPI プロジェクトを作成しました。

デフォルトの _Layout.cshtml を見ると、(頭ではなく) 本文がレンダリングされた後に jquery スクリプトが挿入されていることがわかります。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>@ViewBag.Title</title>
    @Styles.Render("~/Content/themes/base/css", "~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>
    @RenderBody()

    @Scripts.Render("~/bundles/jquery")
    @RenderSection("scripts", required: false)
</body>
</html>

これにより、エラーが発生します

$ is not defined

もちろん、書き込もうとしている

$(document).ready(function() {...}).

の移動

@Scripts.Render("~/bundles/jquery")

_Layout.cshtml の head セクションに追加すると、問題が修正され、jquery が期待どおりに動作します。

調子はどう？私は何か間違ったことをしていますか? _Layout.cshtml 内の Script.Render の既定の場所には理由がありますか?

4

3 に答える 3

12

スクリプトの読み込みと実行により、ページのレンダリングがブロックされます。

これは、ページの複数の部分にアラートを追加することで確認できます。そのため、js ファイルをページの最後に配置することをお勧めします。

ページの最後で、jquery が追加されたセクションの背後にあるページ スクリプトのセクションを作成することで、問題を解決することもできます。

編集:これは、カミソリのセクションに関する Scott Guthrie の記事です: http://weblogs.asp.net/scottgu/archive/2010/12/30/asp-net-mvc-3-layouts-and-sections-with-razor .aspx

于 2012-08-12T22:45:42.657 に答える
3

@Scripts.Render("~/bundles/jquery")はMVC4およびVS2010で問題を引き起こしています。この問題は、jQueryダイアログを作成しようとするとより明らかになります。

JeffN825が述べたように、唯一の解決策はコメントアウトすること@Scripts.Render("~/bundles/jquery")です。

今知られている未知のものは次のとおりです：コメントアウトの影響は何@Scripts.Render("~/bundles/jquery")ですか？

私は次のjqueryライブラリを使用しています：

<script src="../../Scripts/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.8.23.min.js" type="text/javascript"></script>

注：jquery-1.7.2.min.jsは機能しません。

于 2012-09-23T16:26:01.593 に答える
0

受け入れられた回答は、これを行う方法の詳細にリンクしていますが、より直接的な回答は次のようになります。

_Layout.cshtml には行が含まれています...

@RenderSection("scripts", required: false)

...これにより、ビューにある「scripts」という名前のセクションが挿入されます-たとえば、Index.cshtml:

<p>This is Index.cshtml</p>
@section scripts {
   <script>
      $(document).ready(function() {
         alert("This script is inserted by RenderSection after jQuery script is inserted.")
      })
   </script>
}
于 2016-01-12T02:32:40.667 に答える