Getting element within Frame using jQuery
I am trying to access an element which is inside of a frame but haven't had any luck getting to it so far. I have read through a lot of examples here on stackoverflow and in jQuery's documentation but all the examples I've seen have been in reference to iFrames which behave differently than traditional frames. My page structure is as shown below with actual contents removed:
<html>
<head></head>
<frameset>
<frame name="Menu"><html><body>
<!--Menu contents-->
</body></html></frame>
<frameset>
<frame name="SettingsTree"><html><body>
<!--Setting options-->
</body></html></frame>
<frame name="SettingsGrid" id="SettingsGrid"><html><body>
<div id="findthis"></div>
<!--Setting grid values-->
</body></html></frame>
</frameset>
</frameset>
</html>
The way to get contents of "findthis" within an iFrame would be
$('#SettingsGrid').contents().find('#findthis')
however this doesn't return anything. The $('#SettingsGrid') object exists with a length of 1 and all of the html I would expect it to have. However when I call .contents() on that object it returns nothing. I don't know if this is because it hasn't been properly loaded into the DOM or if there is some other issue.
Answer
Try this:
$('#findthis', window.parent.frames[0].document)
Or from the top level:
$('#findthis', top.window.frames[0].document)
See previous question/answer: Run JQuery in the context of another frame