html not loading jquery? (dynamic content loading)

Question

For the site I'm building, I'm trying to dynamically load content from other html files into the index.html (so when you click a nav link it won't load a whole new page, it will just load in content from a different html file). I've been told the best way to do this is using jquery.

I've included the jquery library up in my page head, and I'm able to call the .js file where the code will live (it successfully loaded an alert('boo')), but none of the content within the jquery functions will load. Here's the code:

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"</script>
<script src='js/script.js'></script>

and then in the scrpt.js file:

$(document).ready(function()    {
    $('#content').load('content/index.html');
});

You know you don't close your first script tag, right? Does it make any difference if you do? Can you provide any debugging information at all, or are we to guess? What's in your network tab? See an HTTP request? Anything in the console? — Brad
– Brad, Commented Jun 24, 2013 at 3:39
submit the edited code you have not close the script tag for first one — Vikas Gautam
– Vikas Gautam, Commented Jun 24, 2013 at 4:21

Dorian_gd · Accepted Answer · 2013-06-24 04:32:41Z

1

Do like this:

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

...
<div id="content"> </div>
...

<script>
    $(document).ready(function()    {
        $('#content').load('content/index.html');
    });
</script>

be sure to not forget or mistake the #content and be sure 'content/index.html' can be reach from the actual page. No reason it is not working

EDIT: Be sure to not forget load jquery since jquery != jquery ui

edited Jun 24, 2013 at 4:32

answered Jun 24, 2013 at 4:24

Dorian_gd

1811 silver badge13 bronze badges

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

Comments

JanR · Accepted Answer · 2013-06-24 03:37:49Z

0

Have you tried adding HTTP to your call to jquery:

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

Also you are missing a closing > on your script tag:

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

answered Jun 24, 2013 at 3:37

JanR

6,1303 gold badges25 silver badges30 bronze badges

6 Comments

Brad Over a year ago

This is not the solution. URLs with // are valid, and will use whatever the current protocol is.

Blender Over a year ago

@Brad: It may very well be the solution if OP isn't using a webserver and is opening the HTML files directly with his browser.

JanR Over a year ago

I have had issues in the past when I omitted the http as it was trying to go to: mydomain.com//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js, which I think might depend on settings off the webserver, however I am not sure

Brad Over a year ago

@JanR, I don't believe you. You probably had something inserting your hostname and base path in before your links. I guarantee you that if you use // at the beginning of a URL in HTML, it will work fine.

JanR Over a year ago

Could be, in my case adding the http was the solution :)

|

Collectives™ on Stack Overflow

html not loading jquery? (dynamic content loading)

2 Answers 2

Comments

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related