JQuery and frames - $(document).ready doesn't work

Question

Hi,
I have a page, with some code in js and jQuery and it works very well. But unfortunetly, all my site is very very old, and uses frames. So when I loaded my page inside a frame, $(document).ready() doesn't fire up. My frameset looks like:

<frameset rows="79,*" frameBorder="1" frameSpacing="1" bordercolor="#5996BF" noresize> 
    <frame name="header" src="Operations.aspx?main='Info.aspx'" marginwidth="0" marginheight="0" scrolling="no" noresize frameborder="0">
    <frame name="main" src="Info.aspx" marginwidth="0" marginheight="0" scrolling="auto" noresize frameborder="0">   
</frameset>

My page is loaded into 'main' frame. What schould I do? Please help :)

Answer 1

There is no reason $(document).ready() not to be called. Be sure your page contains an include to jquery.js. Try to do a simple test with an empty html page and just an alert to see if there is another problem.

If you are trying to use this inside the html page that contains the frames definition, keep in mind that there is no document there, you will have to use the

Answer 2

Have you tried to put the jQuery code inside the Info.aspx page?

Answer 3

I don't know is it the best solution, but when I removed $(document).ready() and keep its body, everything works perfect.

Answer 4

Not sure what you're trying to do, but I have an even older classic asp app that operates out of frames, and I just recently added jQuery functionality and it is working great. The $(document).ready() works fine within a frame, but if you wish to reference the DOM in another frame, you'll have to use the Frame's onload event to let you know when the frame's DOM is loaded. Admittedly, I used iFrames, but the concept should be the same.

Answer 5

If you want to fire the onload event for your frames, then follow these steps:

1) Assign a id and name to each tag. Make sure both id and name attributes value is same.

2) Write following code to fire onload event of frame:
       $("frameName").ready(function() {
         // Write you frame onload code here
       }

Answer 6

I assume this is a similar problem I was having with DOMContentLoaded in an iframe.

I wrote a blog post about it.

Answer 7

I have tried the method above:

$("frameName").ready(function() {
    // Write you frame onload code here
} );

and it did not work for me.

this did:

$("frameName").load( function() {
     //code goes here
} );

Even though the event does not fire as quickly - it waits until images and css have loaded also.