Javascript JQuery - $ 未定义

JQuery - $ is not defined

提问by Paul Creasey

I have a simple jquery click event

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

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

and a jquery reference defined in the site.master

和在 site.master 中定义的 jquery 引用

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

I have checked that the script is being resolved correctly, I'm able to see the markup and view the script directly in firebug, so I must be being found. However, I am still getting:

我已经检查过脚本是否被正确解析，我可以直接在 firebug 中看到标记和查看脚本，所以我必须被找到。但是，我仍然得到：

$ is not defined

$ 未定义

and none of the jquery works. I've also tried the various variations of this like $(document).ready and jQuery etc.

并且没有一个 jquery 有效。我还尝试了它的各种变体，如 $(document).ready 和 jQuery 等。

It's an MVC 2 app on .net 3.5, I'm sure I'm being really dense, everywhere on google says to check the file is referenced correctly, which I have checked and checked again, please advise! :/

这是 .net 3.5 上的 MVC 2 应用程序，我确定我真的很密集，谷歌上到处都说要检查文件是否被正确引用，我已经检查并再次检查，请指教！：/

回答by Mike Trpcic

That error can only be caused by one of three things:

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

1. Your JavaScript file is not being properly loaded into your page
2. You have a botched version of jQuery. This could happen because someone edited the core file, or a plugin may have overwritten the $ variable.
3. You have JavaScript running before the page is fully loaded, and as such, before jQuery is fully loaded.

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

First of all, ensure, what script is call properly, it should looks like

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

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

and shouldn't have attributes asyncor defer.

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

Then you should check the Firebugnetpanel to see if the file is actually being loaded properly. If not, it will be highlighted red and will say "404" beside it. If the file is loading properly, that means that the issue is number 2.

然后您应该检查Firebug网络面板以查看文件是否确实被正确加载。如果没有，它将突出显示为红色，并在旁边显示“404”。如果文件加载正确，则意味着问题是 2。

Make sure all jQuery javascript code is being run inside a code block such as:

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

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

This will ensure that your code is being loaded afterjQuery has been initialized.

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

One final thing to check is to make sure that you are not loading any plugins beforeyou load jQuery. Plugins extend the "$" object, so if you load a plugin before loading jQuery core, then you'll get the error you described.

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

Note:If you're loading code which does not require jQuery to run it does not need to be placed inside the jQuery ready handler. That code may be separated using document.readyState.

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

回答by Hanky Panky

It could be that you have your script tag called before the jquery script is called.

可能是在调用 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>

This results as $ is not defined

这导致 $ 未定义

Put the jquery.js before your script tag and it will work ;) like so:

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

回答by Andrew Killen

First you need to make sure that jQuery script is loaded. This could be from a CDN or local on your website. If you don't load this first before trying to use jQuery it will tell you that jQuery is not defined.

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

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

This could be in the HEAD or in the footer of the page, just make sure you load it before you try to call any other jQuery stuff.

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

Then you need to use one of the two solutions below

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

(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); 

or

或者

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

please be aware that many times $(document).ready(function(){//code here});will not work.

请注意多次$(document).ready(function(){//code here}); 不管用。

回答by dandapereira

If the jQuery plugin call is next to the </body>, and your script is loaded before that, you should make your code run after window.onloadevent, like this:

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

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

`

`

so, your code will run only after the window load, when all assets have been loaded. In that point, the jQuery ($) will be defined.

因此，您的代码将仅在窗口加载后，当所有资产都已加载时运行。到那时，$将定义jQuery ( )。

If you use that:

如果你使用它：

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

`

`

the $isn't yet defined at this time, because it is called before the jQuery is loaded, and your script will fail on that first line on console.

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

回答by George R

I just did the same thing and found i had a whole lot of

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

type="text/javacsript"

So they were loading, but no further hint as to why it wasn't working. Needless to say, proper spelling fixed it.

所以他们正在加载，但没有进一步暗示为什么它不起作用。不用说，正确的拼写修复了它。

回答by angularsen

Use a scripts sectionin the view and master layout.

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

Put all your scripts defined in your view inside a Scripts section of the view. This way you can have the master layout load this after all other scripts have been loaded. This is the default setup when starting a new MVC5 web project. Not sure about earlier versions.

将视图中定义的所有脚本放在视图的脚本部分。通过这种方式，您可以在加载所有其他脚本后让主布局加载它。这是启动新的 MVC5 Web 项目时的默认设置。不确定早期版本。

Views/Foo/MyView.cshtml:

视图/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

视图/共享/_Layout.cshtml

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

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

Note how the scriptssection is rendered last in the master layout file.

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

回答by Wolfgang Fahl

make sure you really load jquery this is notjquery - it's the ui!

确保你真的加载了 jquery 这不是jquery - 这是 ui！

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

This is a correct script source for jquery:

这是 jquery 的正确脚本源：

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

回答by Naveed Abbas

As stated above, it happens due to the conflict of $ variable.

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

I resolved this issue by reserving a secondary variable for jQuery with no conflict.

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

var $j = jQuery.noConflict();

and then use it anywhere

然后在任何地方使用它

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

more details can be found here

更多细节可以在这里找到

回答by Nesar

It means that your jQuery library has not been loaded yet.

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

You can move your code after pulling jQuery library.

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

or you can use something like this

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

window.onload = function(){
  // Your code here
};  

回答by tambler

Are you using any other JavaScript libraries? If so, you will probably need to use jQuery in compatibility mode:

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

http://docs.jquery.com/Using_jQuery_with_Other_Libraries

http://docs.jquery.com/Using_jQuery_with_Other_Libraries