'$'未定义。如何在空的ASP.NET MVC 4项目中使用jQuery 2.0.1？

我已经看过：'$' is undefined，但它没有解决我的问题;这就是为什么我打开另一个线程。

这是我做过什么......

我创建使用Visual Studio 2012新的解决方案，并添加一个空的ASP.NET MVC 4项目。我添加了一个控制器类，定义了一个默认的Index动作方法，让Resharper为它创建视图。该项目具有以下结构：

root/ 
    Controllers/ 
     SampleController.cs 
    Models/ 
    Views/ 
     Sample/ 
      Index.cshtml 
     Shared/ 
      Layout.cshtml 
    Scripts/ 
     jquery-2.0.1.js 
     jquery-2-0.1.min.js 
     jquery-2.0.1-min.map

jQuery已通过Nuget添加;所以我手动添加了一个BundleConfig.cs文件到App_Start文件夹并添加了代码来定义jQuery脚本包（RegisterBundles将由global.asax调用）。

public static void RegisterBundles(BundleCollection bundles) 
{ 
    bundles.Add(new ScriptBundle("~/bundles/jquery") 
     .Include("~/Scripts/jquery-2.0.*")); 

}

我还定义了具有以下内容的页面布局......

<!DOCTYPE html> 
<html> 
    <head> 
     <meta name="viewport" content="width=device-width" /> 
     <title>@this.ViewBag.Title</title> 
    </head> 
    <body> 
     <div> 
      @this.RenderBody() 
     </div> 
     @this.RenderSection("Scripts", required: false) 
    </body> 
</html>

我的索引视图有以下内容...

@using System.Web.Optimization 
@model dynamic 

@{ 
    this.Layout = "~/Views/Shared/Layout.cshtml"; 
} 

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

    <script type="text/javascript"> 
     $(document).ready(function() { 

     }); 
    </script> 
}

下面的标记呈现到输出流...

<!DOCTYPE html> 
<html> 
    <head> 
     <meta name="viewport" content="width=device-width" /> 
    </head> 
    <body> 
     <div> 

     </div> 

    <script src="/root/Scripts/jquery-2.0.1.js"></script> 
    <script src="/root/Scripts/jquery-2.0.1.min.map"></script> 

    <script type="text/javascript"> 
     $(document).ready(function() { 

     }); 
    </script> 

    </body> 
</html>

当我调试应用程序时，它给了我错误消息'$'未定义。我没有在我的本地IIS中托管应用程序，而是试图通过Visual Studio的Web Development Server运行它，这给了我另一个提示：语法错误（min.map文件中的意外标记';'）。可能是jQuery未初始化的原因......但我应该如何解决这个问题？

来源

2013-05-31 Matze

它通常有助于查看实际呈现给浏览器的内容：1）'@ Scripts.Render（）'输出了什么？ 2）如果是这样，脚本'src'是否指向一个服务jQuery的URL？ –

是的，@ Scripts.Render输出所有的jQuery脚本文件。 – Matze

它可能呈现jQuery的多个副本（因为路径中的*）？ –

实际问题与我的本地IIS相关，其中静态内容功能不可用。这样做的效果是请求使用OK 200回答的java脚本和css-文件，但内容长度为零。有关如何修复IIS安装的信息，请参阅：https://serverfault.com/questions/115099/iis-content-length-0-for-css-javascript-and-images。

下面的代码现在按预期工作。随之改变的唯一事情是脚本包定义...

BundleConfig.cs

namespace MvcApplication1 
{ 
    using System.Web.Optimization; 

    public class BundleConfig 
    { 
     public const string BundlesJquery = "~/bundles/jquery"; 

     public static void RegisterBundles(BundleCollection bundles) 
     { 
      bundles.Add(new ScriptBundle(BundlesJquery) 
       .Include("~/Scripts/jquery-{version}.js")); 
     } 
    } 
}

Index.cshtml

@using System.Web.Optimization 
@using MvcApplication1 
@model dynamic 

@{ 
    this.ViewBag.Title = "title"; 
    this.Layout = "~/Views/Shared/Layout.cshtml"; 
} 

@section Scripts 
{ 
    @Scripts.Render(BundleConfig.BundlesJquery) 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      alert("Hello World."); 
     }) 
    </script>  
}

Layout.cshtml

@using System.Web.Optimization 
@using MvcApplication1 
<!DOCTYPE html> 

<html> 
    <head> 
     <meta name="viewport" content="width=device-width" /> 
     <title>@this.ViewBag.Title</title> 
    </head> 
    <body> 
     <div> 
      @this.RenderBody() 
     </div> 
     @this.RenderSection("Scripts", false) 
    </body> 
</html>

来源

2013-05-31 20:18:51 Matze

为什么不在HTML中添加脚本？

RootProject/ 
    Pages/ 
    MyPage.aspx 
    JS/ 
    jquery-2-0.1.min.js

MyPage.aspx的代码

<!DOCTYPE html> 
<html> 
    <head> 
     <script type="text/javascript" src="../JS/jquery-2-0.1.min.js"></script> 
    </head> 
    <body> 
     <div> 
      @this.RenderBody() 
     </div> 
     @this.RenderSection("Scripts", required: false) 
    </body> 
</html>

是更好，如果你添加的所有脚本母版页。（请注意，你必须起来在文件夹级别（涨1平这段时间），然后找到文件路径）

来源

2013-05-31 17:39:39 Logar314159

有效，但有捆绑的原因......它包含所有文件，支持不同的配置选项，并支持版本控制。 –

“为什么不在HTML中添加脚本？”，因为他们试图使用捆绑系统。 – Matthew

视图和布局文件在同一级别。我不想将jquery的东西添加到布局根目录，因为它不会被任何视图需要。 – Matze

"Why Source Maps are useful?"

“好吧，假设你正在使用的文件的压缩版本的包括jQuery的压缩版本，你会得到一个报告，说明一个重要的客户遇到了问题，那么你如何调试它？如果你有未压缩的源代码，可以更容易地调试它，但是使用它高流量的制作网站不是一种选择。“

如果你只渲染版本”jquery 2.0“，你可以称之为jquery：

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
       "~/Scripts/jquery-{version}.js"));

有关更多信息，请参阅this。

来源

2013-05-31 17:49:11

当然;我知道...谢谢澄清（ - ： – Matze

使用IE 11和本地网络上的开发/ QA服务器它也可能是兼容性视图设置的问题。

点击IE 11右上角的工具图标（或点击Alt-X）并点击“兼容性视图设置”。

确保服务器名称不在服务器列表中，以使用兼容性视图设置，并且“显示兼容性视图中的Intranet站点”未选中。

来源

2014-06-27 15:40:14

'$'未定义。如何在空的ASP.NET MVC 4项目中使用jQuery 2.0.1？

回答

相关问题