jQuery-$未定义

486

我有一个简单的jquery click事件

<script type="text/javascript">
    $(function() {
        $('#post').click(function() {
            alert("test"); 
        });
    });
</script>

以及在site.master中定义的jquery引用

<script src="<%=ResolveUrl("~/Scripts/jquery-1.3.2.js")%>" type="text/javascript"></script>

我检查了脚本是否已正确解析，可以在Firebug中查看标记并直接查看脚本，因此必须找到我。但是，我仍然得到：

$未定义

而且没有一个jQuery的作品。我还尝试了$（document）.ready和jQuery等的各种变体。

这是.net 3.5上的MVC 2应用程序，我敢肯定我真的很密集，谷歌上的每个地方都说要检查文件是否正确引用，我已经检查过并再次检查过，请告知！：/

javascript  jquery  asp.net-mvc 
— 保罗·克雷西
source
6
如果您使用Fiddler工具检查页面加载，您是否真的看到要求并加载了HTTP200响应代码的jquery-1.3.2.js？
— naivists'2
18
您的脚本在jquery之前执行？
— Surya'2
2
您可以查看源代码并单击js链接吗？好像您的jquery没有加载到页面上。尝试在Firebug控制台屏幕上查看错误，也可以在脚本标签中尝试ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js
— nemke 2010年
2
您的脚本在加载jquery源之前触发了吗？
— Dave Bacher 2010年
1
@ Surya / Dave，我现在回家了，所以我明天再检查一次，然后回去发布，但我认为可能是这个问题：//多么尴尬！
— Paul Creasey 2010年

Answers:

560

该错误只能由以下三种情况之一引起：

  1. 您的JavaScript文件未正确加载到页面中
  2. 您有一个拙劣的jQuery版本。发生这种情况的原因是有人编辑了核心文件，或者插件可能覆盖了$变量。
  3. 您需要在页面完全加载之前以及jQuery完全加载之前运行JavaScript。

首先，请确保正确调用了什么脚本，它应该看起来像

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

并且不应具有异步属性或延迟。

那你应该检查萤火虫 网面板，以查看文件是否实际上已正确加载。如果不是，它将以红色突出显示并在其旁边显示“ 404”。如果文件加载正确，则意味着问题是第2个。

确保所有jQuery javascript代码都在代码块中运行，例如：

$(document).ready(function () {
  //your code here
});

这将确保您的代码被加载 后在初始化jQuery。

最后要检查的一件事是确保您没有加载任何插件 在加载jQuery 之前。插件扩展了“ $”对象，因此，如果您在加载jQuery核心之前先加载插件，则将得到所描述的错误。

注意：如果您正在加载不需要jQuery来运行的代码，则无需将其放置在jQuery ready处理程序中。该代码可以使用分隔document.readyState。

— 迈克·特普契奇
source
182
关于您的代码块，$(document)除非您在该语句之前使用了包括jQuery的脚本标签，否则也不起作用...
— PatrikAkerstrand 2010年
3
我想补充一点，就是我和OP存在相同的问题，我的问题是将https与jquery的库一起使用不能很好地工作。
— Mike Cheel
20
（function（$）{}）（jQuery）;
— JackMahoney
2
@Patrik：请参见我的答案以获取视图中使用脚本部分的解决方案。这样，将首先加载jquery并正确定义$。
— angularsen 2013年
1
检查脚本是否也异步，这就是导致我的问题的原因。
— Anders
207

可能是在调用jquery脚本之前调用了script标记。

<script type="text/javascript" src="js/script.js"></script>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

结果为$未定义

将jquery.js放在您的脚本标签之前，它将可以工作;），如下所示：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript" src="js/script.js"></script>
— 汉基·潘基
source
1
这是一个很好的回应。我尝试过，它对我有用。我正在使用VS 2013和ASP.net。您知道如何在页面自动加载到asp.net中之前使javascript加载吗？还是必须在所有文件中以这种方式引用javascript？
— 帕特
添加到您的答案。在ASP.net你可以进入Shared_Layout.cshtml`<HEAD> </ HEAD>`
— 帕特
@pat并确保您将代码编写在@section Scripts标签内
— Marc
请更新答案以使用HTTPS并考虑使用SPI devdocs.io/html/attributes#integrity-attribute
— Josh Habdas
65

首先，您需要确保已加载jQuery脚本。这可能来自CDN或您网站上的本地。如果您在尝试使用jQuery之前不首先加载它，它将告诉您jQuery未定义。

<script src="jquery.min.js"></script>

这可以在页面的HEAD或页脚中，只需确保在尝试调用任何其他jQuery东西之前加载它即可。

然后，您需要使用以下两种解决方案之一

(function($){
// your standard jquery code goes here with $ prefix
// best used inside a page with inline code, 
// or outside the document ready, enter code here
 })(jQuery);

要么

jQuery(document).ready(function($){
// standard on load code goes here with $ prefix
// note: the $ is setup inside the anonymous function of the ready command
});

请注意，很多时候$（document）.ready（function（）{// code here}）; 不管用。

— 安德鲁·基伦
source
1
“未定义jQuery”。但是，它在页面加载后存在。
— Paul Totzke '16
不知道这是一个问题还是声明，但是，在尝试使用jQuery脚本之前，我会先检查一下。听起来就像您将其加载到页脚中并在页面较高处调用内容一样。
— Andrew Killen
抱歉，我认为这是一种可以按任何顺序使用脚本的技术。是的，我在MVC样式的主体部分中使用了它。mycode.js和jQuery.js是页面上的最后两件事。
— Paul Totzke '16
Paul，请放心，我已经编辑了解决方案，其中包括“您必须...首先加载”。:)
— Andrew Killen
这样是否解决了“我的脚本顺序正确但脚本加载顺序不同”的问题。我记得4年前做过这样的事情，但我不记得它解决了什么问题。
— Paul Totzke，2016年
50

如果jQuery插件调用位于旁边</body>，并且在此之前加载了脚本，则应使代码在window.onload事件后运行，如下所示：

window.onload = function() {
  //YOUR JQUERY CODE
}

`

因此，您的代码将仅在加载所有资产后的窗口加载后运行。在这一点上，$将定义jQuery（）。

如果您使用：

$(document).ready(function () {
  //YOUR JQUERY CODE
});

`

在$还没有在这个时候确定的，因为jQuery是加载之前它被称为，你的脚本将失败上的控制台，第一道防线。

— 丹达佩雷拉
source
通常，绑定window.unload是一个坏主意。这将是唯一有效的活动！！！
— Rudi Strydom
注意：请记住，您只能分配一个window.onload函数，如果您为其分配另一个函数，则不会执行前一个函数。
— 布鲁诺·佩雷斯
28

我只是做了同样的事情，发现我有很多 

type="text/javacsript"

因此他们正在加载，但是没有进一步提示为什么它不起作用。不用说，正确的拼写将其修复。

— 乔治·R
source
主持人注意：本文中的错别字是有意为之，以说明重点。请不要编辑帖子以“纠正”此问题。
— 马丁·彼得斯
23

在视图和主版式中使用脚本部分。

将在视图中定义的所有脚本放入视图的“脚本”部分中。这样，您可以在所有其他脚本均已加载之后，使主版式加载。启动新的MVC5 Web项目时，这是默认设置。不确定早期版本。

Views / Foo / MyView.cshtml：

// The rest of your view code above here.

@section Scripts 
{ 
    // Either render the bundle defined with same name in BundleConfig.cs...
    @Scripts.Render("~/bundles/myCustomBundle")

    // ...or hard code the HTML.
    <script src="URL-TO-CUSTOM-JS-FILE"></script>

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

        // Do your custom javascript for this view here. Will be run after 
        // loading all the other scripts.            
      });
    </script>
}

视图/共享/_Layout.cshtml

<html>
<body>
    <!-- ... Rest of your layout file here ... -->

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

请注意，脚本部分是如何在主布局文件中最后呈现的。

— 安格森
source
2
注意：根据设计，部分视图中不支持视图部分。
— 亚当·内罗尔
这就是我修复程序所要做的...。我应该更清楚地知道应该首先使用@Scripts，但是在寻找修复程序之前就忘了它。
— Caverman
12

确保您确实加载了jQuery，而不是 jQuery-这是UI！

  <script language="JavaScript" 
    src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js">
  </script>

这是jquery的正确脚本源：

 <script language="JavaScript"  src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
— 沃尔夫冈·法尔
source
11

如上所述，它是由于$变量的冲突而发生的。

我通过为jQuery保留一个辅助变量而没有冲突解决了这个问题。

var $j = jQuery.noConflict();

然后在任何地方使用

$j( "div" ).hide();

更多细节可以在这里找到

— 纳韦德·阿巴斯
source
8

这意味着您的jQuery库尚未加载。

您可以在拉出jQuery库后移动代码。

或者你可以使用这样的东西

window.onload = function(){
  // Your code here
};
— 内萨尔
source
在DOM加载后触发，但在后台运行的控件，javascript和其他程序加载时不触发。为此需要使用时间延迟。
— Fandango68
5

经过一些测试，我找到了一个快速的解决方案，您可以在索引页面顶部添加：

<script>
$=jQuery;
</script>

它工作得很好:)

— Mimouni
source
4
问题是：$没有定义，不是吗？
— Mimouni
未捕获的ReferenceError：jQuery未定义
— Simon Schnell
您是否将其放在jQuery库导入的下面？
— 迈克·沃伦
4

当我拼写错误的jQuery引用而不是type="text/javascript"键入“ ... javascirpt” 时，我得到了相同的错误消息。;）

— 阿兰
source
尤里卡！我有我的type="text/css"。感谢您保存我的理智！
— Jeriko 2011年
我无所适从type="javascript"。浪费了30分钟才找到它。
— 梅森2015年
4

听起来jQuery无法正确加载。您正在使用哪个源/版本？

另外，它可能是名称空间冲突，因此请尝试显式使用jQuery而不是使用$。如果这样可行，您可能希望使用noConflict来确保正在使用的其他代码$不会中断。

— 亚历山大·杜玛（Alexender Dumma）
source
3

该错误意味着jQuery尚未加载到页面上。使用jQuery $(document).ready(...)或它的任何变体都没有好处$。

使用window.onload应该在这里工作。请注意，只能将一个功能分配给window.onload。为了避免丢失原始的onload逻辑，您可以像这样装饰原始函数：

originalOnload = window.onload;
window.onload = function() {
  if (originalOnload) {
    originalOnload();
  }
  // YOUR JQUERY
};

这将执行最初分配给的功能，window.onload然后执行// YOUR JQUERY。

有关装饰器模式的更多详细信息，请参见https://en.wikipedia.org/wiki/Decorator_pattern。

— 凯尔·麦克维
source
2

我使用Url.Content，从来没有问题。

<script src="<%= Url.Content ("~/Scripts/jquery-1.4.1.min.js") %>" type="text/javascript"></script>
— mdm20
source
2

在解决方案中提到-“最后要做的一件事是确保在加载jQuery之前不加载任何插件。插件会扩展“ $”对象，因此，如果在加载jQuery核心之前加载了插件，则您会得到您描述的错误。”

为了避免这种情况-

就像jQuery一样，许多JavaScript库都将$用作函数或变量名。在jQuery的情况下，$只是jQuery的别名，因此无需使用$即可使用所有功能。如果我们需要在jQuery旁边使用另一个JavaScript库，则可以通过调用$ .noConflict（）将$的控制权返回到另一个库：

1

我曾经有这个问题，但没有明显的原因。当我通过aspnet开发服务器运行时，它在本地发生。它一直在工作，我将所有内容恢复到以前一直在工作但仍然不起作用的状态。我查看了chrome调试器，并成功加载了jquery-1.7.1.min.js。一切都很混乱。我仍然不知道问题出在什么地方，而是关闭浏览器，关闭开发服务器，然后再次尝试解决问题。

— 割让
source
1

只需将jquery网址放在jquery代码的顶部

像这样 - 

<script src="<%=ResolveUrl("~/Scripts/jquery-1.3.2.js")%>" type="text/javascript"></script>

<script type="text/javascript">
    $(function() {
        $('#post').click(function() {
            alert("test"); 
        });
    });
</script>
— 维兰克斯
source
1

我有同样的问题，这是因为我对jQuery.js的引用不在标记中。一旦我切换了，一切就开始起作用。

安东尼

— 安东尼
source
1

  1. 检查是否包含您的jquery文件的确切路径。

    <script src="assets/plugins/jquery/jquery.min.js"></script>

如果将其添加到页面底部，请全部在此声明下方调用JS函数。

  1. 使用此代码测试进行检查，

    <script type="text/javascript">
/***
 * Created by dadenew
 * Submit email subscription using ajax
 * Send email address
 * Send controller
 * Recive response
 */
$(document).ready(function() { //you can replace $ with Jquery

  alert( 'jquery working~!' );
});

和平！

— 丹尼尔·阿德纽
source
0

我们有同样的问题....但是我偶然检查了文件夹属性并进行了设置...

您必须检查要访问的每个文件夹的属性。

  1. 右键点击文件夹
  2. “权限”标签
  3. 设置文件夹访问权限：所有者：创建和删除文件组：访问文件其他：访问文件

我希望这是解决方案……

— RoyS_philippines
source
0

在asp.net中使用jQuery时，如果使用的是母版页，并且要在其中加载jquery源文件，请确保在所有jquery脚本引用之后都具有标头contentplaceholder。

我有一个问题，使用该母版页的任何页都将返回“未定义$”，这仅仅是因为错误的顺序使客户端代码在创建jquery对象之前运行。因此，请确保您具有：

<head runat="server">
    <script type="text/javascript" src="Scripts/jquery-VERSION#.js"></script>
    <asp:ContentPlaceHolder id="Header" runat="server"></asp:ContentPlaceHolder>
</head>

这样，代码将按顺序运行，您将能够在子页面上运行jQuery代码。

— 弗朗西斯·穆西尼亚克（Francis Musignac）
source
0

就我而言，我指的是Google托管的JQuery。它已正确包含在内，但我在HTTPS页面上，并通过HTTP调用它。一旦解决了问题（或允许使用不安全的内容），它就会立即启动。

— 安东尼
source
0

我遇到了同样的问题，无法弄清楚是什么原因造成的。我最近将HTML文件从日语转换为UTF-8，但是对脚本文件没有任何处理。jquery-1.10.2.min.js在此过程中以某种方式损坏（我仍然不知道如何）。用原始修复替换jquery-1.10.2.min.js。

— 加文
source
0

看来，如果将jquery.js文件放在html文件所在的同一文件夹下或某些子文件夹下，则Firebug问题就解决了。例如，如果您的html位于C：/ folder1 /下，则您的js文件也应位于C：/ folder1 /（或C：/ folder1 / folder2等）下，并在html文档中进行相应处理。希望这可以帮助。

— sc123
source
0

我有同样的问题，没有案例可以解决我的问题。唯一对我有用的东西是放在Site.master文件的下面，接着是：

<script src="<%= ResolveUrl("~/Scripts/jquery-1.7.1.min.js") %>" type="text/javascript"></script>
<script src="<%= ResolveUrl("~/Scripts/bootstrap/js/bootstrap.min.js") %>" type="text/javascript"></script>

使用src =“ <％= ResolveUrl（”“）...内容页面中的jQuery加载正确。

— 阿米利亚人
source
0

我有一个非常相似的问题。在我的C＃MVC应用程序中，无法识别JQuery。我需要将@ Scripts.Render（“〜/ bundles / jquery”）从我的_Layout.cshtml文件的底部移至该部分的开头。如果要使用Visual Studio，还请确保已将Jquery作为Nuget软件包使用！

<head>
    @Scripts.Render("~/bundles/jquery")
</head>
— HO
source
0

有一种方法可以使其在其余代码运行之前自动加载javascript。

进入Views \ Shared_Layout.html并添加以下内容 

<head>
  <*@ Omitted code*@>
  <script src="~/Scripts/jquery-1.10.2.min.js" type="text/javascript"></script>
</head>
— 拍
source
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.