jQuery executing JavaScript on dynamically loaded HTML

Question

I have developed a Wordpress site that loads pages dynamically using the .load function.

I have installed a few plugins that I NEED to get working, there is no substitute. My problem is that these plugins rely on JavaScript (an AJAX contact form, and a photo gallery) when they are loaded into div#content the required JavaScript doesn't execute on the dynamically loaded content.

A normal solution would be load the JavaScript I need with the page, but since this is done with Wordpress and the <script> tags are placed in <head> by the plugin. Another solution I have considered is using jQuery's $.getScript, but again since the JS is already in the head this will cause conflicts. I am really stuck as to where to go next.

Any help appreciated guys.

Why don't you call your plugin initialization in the "complete" callback of the .load() method ? — Didier Ghys
– Didier Ghys, Commented Jan 20, 2012 at 9:34
@DidierGhys if you'd posted this as an answer I would have accepted it to give you rep — Lee Price
– Lee Price, Commented Jan 20, 2012 at 11:10

Didier Ghys · Accepted Answer · 2012-01-20 11:26:34Z

1

Why don't you use the "complete" callback of the .load() method to instantiate your plugins to the added elements ?

 .load( url [, data] [, complete(responseText, textStatus, XMLHttpRequest)] )  

 url: A string containing the URL to which the request is sent.    
 data: A map or string that is sent to the server with the request.    
 complete(responseText, textStatus, XMLHttpRequest): A callback function that is executed when the request completes.

The use is:

$('#insertIntoThis').load('url', function(data, status, xhr) {
    // instantiate here
    // $('#myelement').myPlugin();
});

answered Jan 20, 2012 at 11:26

Didier Ghys

30.6k9 gold badges77 silver badges82 bronze badges

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

Collectives™ on Stack Overflow

jQuery executing JavaScript on dynamically loaded HTML

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