JQuery - $ 未定义答案

【问题标题】：JQuery - $ is not definedJQuery - $ 未定义
【发布时间】：2021-10-25 21:22:02
【问题描述】：

我有一个简单的 jquery 点击事件

<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 应用程序，我确定我真的很密集，谷歌上到处都说要检查文件是否正确引用，我已经检查并再次检查，请指教！：/

【问题讨论】：

如果您使用 Fiddler 工具检查页面加载，您是否真的看到请求并加载了 HTTP200 响应代码的 jquery-1.3.2.js？
你的脚本是在 jquery 之前执行的吗？
能否查看源码并点击js链接。好像你的 jquery 没有加载到页面上。尝试 Firebug 控制台屏幕以查看错误在您的脚本标签中也尝试ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js
你的脚本在 jquery 源加载之前触发了吗？
@Surya/Dave，我已经回家了，所以我明天再检查一遍，然后回来发帖，但我认为这可能是问题所在，：/多么尴尬！

标签： javascript jquery asp.net-mvc

【解决方案1】：

您是否在使用任何其他 JavaScript 库？如果是这样，您可能需要在兼容模式下使用 jQuery：

http://docs.jquery.com/Using_jQuery_with_Other_Libraries

【讨论】：

【解决方案2】：

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

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

【讨论】：

【解决方案3】：

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

您的 JavaScript 文件未正确加载到您的页面中
您有一个拙劣的 jQuery 版本。这可能是因为有人编辑了核心文件，或者插件可能覆盖了 $ 变量。
您在页面完全加载之前运行了 JavaScript，因此，在 jQuery 完全加载之前。

首先，确保正确调用的脚本应该是这样的

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

并且不应具有 async 或 defer 属性。

然后你应该检查Firebug net 面板，看看文件是否真的被正确加载了。如果没有，它将以红色突出显示，并在其旁边显示“404”。如果文件加载正确，这意味着问题是 2。

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

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

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

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

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

【讨论】：

关于您的代码块，$(document) 也不起作用，除非您在该语句之前有一个包含 jQuery 的脚本标记...
我想补充一点，我遇到了与 OP 相同的问题，我的问题是使用 https 和 jquery 的库效果不佳。
(函数($){ })(jQuery);
@Patrik：使用视图中的脚本部分查看我的解决方案的答案。这种方式将首先加载 jquery 并正确定义 $。
检查你的脚本是否也有异步，这就是导致我的问题的原因。

【解决方案4】：

当我拼错 jQuery 引用时，我收到了同样的错误消息，而不是 type="text/javascript" 我输入了“...javascirpt”。 ;)

【讨论】：

尤里卡！我有我的type="text/css"。谢谢你拯救我的理智！
我搞砸了type="javascript"。浪费了 30 分钟才找到它。

【解决方案5】：

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

type="text/javacsript"

所以他们正在加载，但没有进一步暗示为什么它不工作。不用说，正确的拼写可以解决它。

【讨论】：

版主说明：这篇文章的错字是deliberate，为了说明一点。请不要编辑帖子以“更正”这一点。

【解决方案6】：

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

<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>

【讨论】：

这是一个很好的回应。我试过了，它对我有用。我正在使用 VS 2013 和 ASP.net。你知道如何在页面自动加载到 asp.net 之前让 javascript 加载，还是我必须在我的所有文件中以这种方式引用 javascript？
添加到您的答案中。在 ASP.net 中，您可以进入 Shared_Layout.cshtml ` `
@pat 并确保将代码写在 @section Scripts 标签内
请更新答案以使用 HTTPS 并考虑使用 SPI devdocs.io/html/attributes#integrity-attribute
哇哇哇哇哇哇哇哇哇哇！我花了将近一个星期（每晚大约一个小时）想知道我做错了什么（并尝试一个又一个修复）！再次感谢:)

【解决方案7】：

我曾经无缘无故地遇到过这个问题。当我通过 aspnet 开发服务器运行时，它在本地发生。它一直在工作，我将所有内容恢复到以前工作的状态，但仍然无法正常工作。我查看了 chrome 调试器，jquery-1.7.1.min.js 已经加载，没有任何问题。这一切都非常令人困惑。还是不知道是什么问题，关了浏览器，关了开发服务器，再试一下就解决了。

【讨论】：

【解决方案8】：

我们有同样的问题....但我不小心检查了文件夹属性并设置了一些东西...

您必须检查您正在访问的每个文件夹的属性..

右键文件夹
“权限”标签
设置文件夹访问权限： OWNER：创建和删除文件组：访问文件其他：访问文件

我希望这是解决方案......

【讨论】：

【解决方案9】：

在解决方案中提到 - “最后要检查的一件事是确保在加载 jQuery 之前没有加载任何插件。插件扩展了“$”对象，所以如果你在加载 jQuery 核心之前加载插件，那么你会得到你描述的错误。”

为了避免这种情况 -

许多 JavaScript 库使用 $ 作为函数或变量名，就像 jQuery 一样。在 jQuery 的例子中，$ 只是 jQuery 的别名，所以所有功能都可以在不使用 $ 的情况下使用。如果我们需要在 jQuery 旁边使用另一个 JavaScript 库，我们可以通过调用 $.noConflict() 将 $ 的控制权返回给另一个库：

【讨论】：

【解决方案10】：

只需将 jquery url 放在 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>

【讨论】：

【解决方案11】：

听起来 jQuery 没有正确加载。您使用的是哪个源/版本？

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

【讨论】：

【解决方案12】：

我遇到了同样的问题，这是因为我对 jQuery.js 的引用不在标记中。一旦我切换它，一切都开始工作了。

安东尼

【讨论】：

【解决方案13】：

在 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 代码。

【讨论】：

【解决方案14】：

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

【讨论】：

【解决方案15】：

在这里尝试了一切都没有结果后，我只是通过将脚本 src 标签从正文移动到头部来解决问题

【讨论】：

这不是问题的答案。请不要用无益的答案向 SO 发送垃圾邮件，这些答案对主题没有任何帮助。如果您认为您的经验可能对其他人有所帮助，请将其作为简短评论或提供正确答案并完整解释解决方案。

【解决方案16】：

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

<script>
$=jQuery;
</script>

效果很好:)

【讨论】：

问题是：$ 没有定义，不是吗？
Uncaught ReferenceError: jQuery is not defined
你把它放在 jQuery 库导入的正下方了吗？

【解决方案17】：

在视图和主布局中使用脚本部分。

将视图中定义的所有脚本放入视图的脚本部分。这样，您可以在加载所有其他脚本后让主布局加载。这是启动新的 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>
}

Views/Shared/_Layout.cshtml

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

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

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

【讨论】：

注意：部分视图设计不支持视图部分。
这是我必须为我的修复做的......而且我应该知道更好地使用@Scripts，但在我寻找修复之前忘记了它。跨度>

【解决方案18】：

首先，您需要确保已加载 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}); 不起作用。

【讨论】：

“jQuery 未定义”。但是，它在页面加载后存在。
不确定这是一个问题还是一个陈述，但是，在您尝试使用它之前，我会检查您是否调用了 jQuery 脚本。听起来您将其加载到页脚并在页面上方调用。
抱歉，我认为这是一种您可以按任意顺序使用脚本的技术。是的，我在 MVC 样式的正文部分中使用了它。 mycode.js 然后 jQuery.js 是页面上的最后两件事。
别担心，保罗，我已经编辑了解决方案，包括“你必须...首先加载”。 :)
这是否解决了“我的脚本顺序正确但脚本加载顺序不同”的问题。我记得 4 年前做过类似的事情，但我不记得它解决了什么问题。

【解决方案19】：

我遇到了同样的问题，但不知道是什么原因造成的。我最近将我的 HTML 文件从日语转换为 UTF-8，但我没有对脚本文件做任何事情。不知何故 jquery-1.10.2.min.js 在这个过程中被破坏了（我仍然不知道如何）。将 jquery-1.10.2.min.js 替换为原来的修复它。

【讨论】：

【解决方案20】：

看来，如果您将 jquery.js 文件定位在同一文件夹下或 html 文件所在的某些子文件夹中，Firebug 问题就解决了。例如，如果您的 html 在 C:/folder1/ 下，那么您的 js 文件也应该在 C:/folder1/（或 C:/folder1/folder2 等）下的某个位置，并在 html 文档中进行相应处理。希望这会有所帮助。

【讨论】：

【解决方案21】：

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

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

`

因此，您的代码将仅在加载完所有资源后窗口加载后运行。此时，将定义 jQuery ($)。

如果你使用它：

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

`

$ 目前尚未定义，因为它在 jQuery 加载之前被调用，并且您的脚本将在控制台的第一行失败。

【讨论】：

绑定到 window.unload 通常是个坏主意。它实际上将是唯一运行的事件！！！
注意：记住你只能分配一个window.onload函数，如果你给它分配另一个函数，前一个不会被执行。

【解决方案22】：

你只需在页面的开头添加

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

并在任何浏览器地址栏中检查您的 src 链接，如果您得到一些代码，那么这对您有用。好像

【讨论】：

【解决方案23】：

我有同样的问题，没有案例可以解决我的问题。唯一对我有用的是，它放在 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="

【讨论】：

【解决方案24】：

检查包含的 jquery 文件的确切路径。

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

如果你在页面底部添加这个，请在这个声明下面都调用JS函数。

使用此代码测试检查，

<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~!' );
});

和平！

【讨论】：

【解决方案25】：

我有一个非常相似的问题。在我的 C# MVC 应用程序中，无法识别 JQuery。我需要将 @Scripts.Render("~/bundles/jquery") 从我的 _Layout.cshtml 文件的底部移动到该部分的头部。如果您使用的是 Visual Studio，还请确保您已将 Jquery 作为 Nuget 包获取！

<head>
    @Scripts.Render("~/bundles/jquery")
</head>

【讨论】：

【解决方案26】：

如前所述，这是由于$变量的冲突造成的。

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

var $j = jQuery.noConflict();

然后在任何地方使用它

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

更多详情可以找到here

【讨论】：

【解决方案27】：

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

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

<head>
  <*@ Omitted code*@>
  <script src="~/Scripts/jquery-1.10.2.min.js" type="text/javascript"></script>
</head>

【讨论】：

【解决方案28】：

确保你真的加载了 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>

【讨论】：

【解决方案29】：

这意味着你的jQuery库还没有被加载。

你可以在拉取 jQuery 库后移动你的代码。

或者你可以使用类似的东西

window.onload = function(){
  // Your code here
  // $(".some-class").html("some html");
};

【讨论】：

这会在 DOM 加载后触发，但不会在后台运行的控件、javascript 和其他程序加载时触发。为此需要使用时间延迟。

【解决方案30】：

该错误表示页面上尚未加载 jQuery。使用$(document).ready(...) 或其任何变体都没有好处，因为$ 是jQuery 函数。

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

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

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

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

【讨论】：