Load HTML/Javascript dynamically

Question

I have an index.html page and I want to load the content of another page to index.html dynamically using jQuery. I use $.load() function to do this :

$('#dynamic_content').load('another.html #toLoad')

It works fine, but I need also to load javascript files that uses another.html, so I do:

$('#dynamic_content').load('another.html #toLoad');
$.getScript('js/another.js');

The problem is that the js code of 'another.js' sometimes doesn't 'apply' to html page(maybe it loads earlier than the html page) Content of another.js:

$(document).ready(function {} {

   $('#cancelButton').click(function() {
       //do something 

});

});

Have you tried loading the scripts before loading the html?

Yet Another Geek
– Yet Another Geek

2011-06-18 17:40:29 +00:00
Commented Jun 18, 2011 at 17:40 — Yet Another Geek
– Yet Another Geek, Commented Jun 18, 2011 at 17:40

Darin Dimitrov · Accepted Answer · 2011-06-18 17:40:06Z

10

Use the success callback:

$('#dynamic_content').load('another.html #toLoad', function() {
    $.getScript('js/another.js');
});

This way if another.js manipulates the dynamically loaded contents from another.html it will be guaranteed that this content has already been injected into the current DOM tree.

answered Jun 18, 2011 at 17:40

Darin Dimitrov

1.0m275 gold badges3.3k silver badges3k bronze badges

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

Collectives™ on Stack Overflow

Load HTML/Javascript dynamically

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related