3

I have a HTML page which having 1 div.

<div id="secondPage"></div>

and having 

<script>
$(document).ready(function(){

$("secondPage").load("mySecondHtmlPage.html")
})
</script>

This mySecondHtmlPage.hmtl is loading but I want to have another document ready function in that second html page, which is not firing.

When I have a jQuery reference in that page(second html) too documentReady function is getting fired but it is not loading properly inside the div.

Second html page:

<div>
 My Content  goes here
</div>
<script>
$(document).ready(function(){
alert(''); //Not firing 
})
</script>

When I have a jQuery ref over top that alert is firing but it is not getting loaded in 1st html page.

Mukesh Ram
  • 6,248
  • 4
  • 19
  • 37
sudhir
  • 1,387
  • 3
  • 25
  • 43

3 Answers3

0

You can trigger a different event once the page is loaded:

$( "#secondPage" ).load( "mySecondHtmlPage.html", function() {
    $(document).trigger('page-ready');
});

Then use this on the second page:

<div>
     My Content  goes here
</div>
<script>
    $(document).on('page-ready', function(){
        alert(''); //Not firing 
    });
</script>

Read more about .trigger() here.

Sinan Guclu
  • 1,075
  • 6
  • 16
0

you should use iframe or XMLHttpRequest

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
       // Action to be performed when the document is read;
    }
};
xhttp.open("GET", "filename", true);
xhttp.send();
Jordi Flores
  • 2,080
  • 10
  • 16
0

Place all your javascript code from mySecondHtmlPage.html in the first page, or better detach the javascript from both pages in a expernal javascript file that you link to the first page

madalinivascu
  • 32,064
  • 4
  • 39
  • 55