Using ajax: $(document).ready() firing immediatly within a jQuery-AJAX call on newest questions tagged ajax – Stack Overflow

I have an html page called search.html that contains the following jQuery code :

$(document).ready(function(){
...some code // THIS IS THE CODE I'M INTERESTED IN
}
...some other code

And I have another html page that contains the following jQuery code:

$("#display_area").load("search.html") // #display_area is a div

The problem is, when this jQuery code is called, it inserts the content of search.html but executes the code that I’m interested in (the code in the $(document).ready() section) immediately, it doesn’t wait for the DOM to be ready, which obviously generates errors.

The other codes (outside the $(document).ready() section) execute normally without any problems.

Placing the code within the callback function of the .load() function doesn’t work either, the code fires while the DOM isn’t ready.

Is there any way to solve this ? Any help would be appreciated.

EDIT : I just want to specify, that the search.html contains a DOM of its own that is going to be inserted in the #display_area div, and I want my code to fire when the #display_area div has finished loading all its new DOM (content) that was loaded through the load() function.

See Answers


source: http://stackoverflow.com/questions/11206115/document-ready-firing-immediatly-within-a-jquery-ajax-call
Using ajax: using-ajax



online applications demo