JavaScript runtime error: '$' is undefined

Question

So classic problem, but having a horrible time on finding the actual cause. Typically when I see this error it's because the jQuery reference is after code requiring it, or back jQuery link, or jQuery conflict, etc... so far none of those appear to be the case. Unfortunately seeking out the solution to this problem has lead me to post after post of such cases. I'm sure my problem here is equally as simple, but over an hour of hunting, still no luck...

Edit: Additional information... The solution file (which I've recreated multiple times trying to figure this out. Is a JavaScript Windows Store Blank App template and I'm doing this in Visual studio. The only references files is Windows Library for javascript 1.0, I have tried deleting this to test as well.

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>HTML5 Canvas Template</title>
        <style>
            /* styles here */
        </style>
    </head>
    <body>
        <canvas id="myCanvas" width="500" height="500">
            <p>Canvas not supported.</p>
        </canvas>

        <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                var canvas = $("#myCanvas").get(0);
                var context = canvas.getContext("2d");

                function renderContent()
                {
                    // we'll do our drawing here...
                }

                renderContent();
            });
        </script>
</body>
</html>

I have tried a different source link (3 actually) but thanks for checking icanc - man I hate those kind of situations... but that does tell me the problem isn't limited to the code itself, perhaps something in the nature of my solution is at fault. — Eric J Fisher
– Eric J Fisher, Commented Feb 20, 2013 at 2:47

samayo · Accepted Answer · 2014-05-15 13:39:38Z

15

It's states that JQuery referred URL is not correct

Try this:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

edited May 15, 2014 at 13:39

samayo

16.5k13 gold badges95 silver badges115 bronze badges

answered Feb 20, 2013 at 2:49

coder

13.2k32 gold badges116 silver badges221 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Eric J Fisher Over a year ago

I was able to access the file at my previous link, but went ahead and replaced it with the URL for this one, confirming I could access it as well. But I'm still getting an error as if I have no reference to jQuery present :( (I added the missing "http:" on the front of it, but did try it with out for the heck of it) Edit: more details

coder Over a year ago

I think this is devhammer.net/blog/exploring-html5-canvas-part-1---introduction what you're using try to download the complete file from the link and test it.

Eric J Fisher Over a year ago

That's the exact set of tutorials I'm working on to learn canvas, and while I see many useful links there I don't see a link for the final code. He does offer up the JSFIDDLE with code in it, but if you look at the HTML the script tags are completely omitted which is my current suspicion is related to this problem. I've looked over three times just to make sure I didn't miss the download link :(

coder Over a year ago

Here is the fiddle demo jsfiddle.net/NqmkC/1 with the JQuery link I provided

Eric J Fisher Over a year ago

Thank you, I tried using it, same problem fails the moment it his the $(document).ready() as undefined. It's got to be something with the solution itself, I've been digging all over the developer forums specific for this as well, still coming up empty handed.

|

RickInLosAngeles · Accepted Answer · 2016-05-04 18:09:40Z

2

I tried everything listed above and nothing seems to work until I put this string

<script src="../scripts/jquery-2.2.3.min.js" type="text/javascript"></script>

in the head section of the HTML file. So here's how it looks:

<!DOCTYPE html>
<html>
<head>

    <!-- jQuery Reference -->
    <script src="../scripts/jquery-2.2.3.min.js" type="text/javascript"></script>

    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />


    <title>some title</title>

</head>
<body>
...

And the js file is located at a level below in the folder 'scripts'. Finally, the error is gone and what a relief!

answered May 4, 2016 at 18:09

RickInLosAngeles

1891 silver badge15 bronze badges

2 Comments

NoBullMan Over a year ago

bless your soul! Spent the whole day trying to figure out what i was doing wrong. I had the exact same situation and this was it! Thank you.

Bluebaron Over a year ago

This is not a good thing to do because the browser will block rendering until the JavaScript is downloaded. Google Page Speed will tell you that.

Chris Gillum · Accepted Answer · 2015-07-27 22:51:54Z

1

In my case, the problem was that I was rendering my page over https but I was trying to request the JQuery file over http, which is blocked by many browsers for security reasons.

My fix was to change this...

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

...to this...

<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>

This causes the browser to download JQuery using the same protocol (http or https) as the page being rendered.

answered Jul 27, 2015 at 22:51

Chris Gillum

15.1k5 gold badges52 silver badges68 bronze badges

Comments

Pascal Klein · Accepted Answer · 2016-01-06 01:22:45Z

1

Some of my clients had this problem, because apparently they blocked loading Javascript from 3rd party sites. So now I always use the following code to include jQuery:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
window.jQuery || 
document.write('<script type="text/javascript" src="/js/jquery-1.9.1.min.js">\x3C/script>')
</script>

This makes sure, that even if my client blocks loading the Javascript file from the CDN domain, the client still downloads the file from my own server, which is not blocked by the browser.

answered Jan 6, 2016 at 1:22

Pascal Klein

25.1k25 gold badges84 silver badges122 bronze badges

Comments

Rajesh · Accepted Answer · 2014-07-03 10:42:04Z

0

Anover variant, in my case - I was forced to use proxy. So - IE11--> InternetOptions --> Connections-->LANSettings-Proxy Server--> UseProxyServer - should be checked. Also check awailability of jQUery script source, my worked variant in VS2012 - -just like in top example

edited Jul 3, 2014 at 10:42

Rajesh

10.4k16 gold badges47 silver badges65 bronze badges

answered Jul 3, 2014 at 10:22

user3801205

1

Comments

CodeMouse92 · Accepted Answer · 2016-04-27 21:54:36Z

-1

I was getting this same error code:

(Error: 'generateText' is undefined)

...on the code

var bodyText=["The....now."]

I discovered on my text-editor(Notepad++), when typing many lines of text in the directly above the variable bodyText, if I didn't hit return carriage (enter==>WordWrap is off) just kept typing w/o return carriage and let the editor adjust text it worked?

Must be in the settings of Notepad++??

edited Apr 27, 2016 at 21:54

CodeMouse92

6,91814 gold badges76 silver badges132 bronze badges

answered Apr 27, 2016 at 21:43

user6263772

1

Collectives™ on Stack Overflow

JavaScript runtime error: '$' is undefined

6 Answers 6

8 Comments

2 Comments

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

8 Comments

2 Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related