Get a variable in an iframe from the parent

Question

How do I get a variable in an iframe from the parent if I do not know how many iframes are on the parent page and the order of the one in question. For instance, I know the iframe in question is the second one, so I can select windows.frames[1]. But if I didn't know know it was the second one, how would I select it by ID.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
        <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" /> 
        <title>Testing</title>  
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js" type="text/javascript"></script>
        <style type="text/css">
        </style> 
        <script type="text/javascript"> 
            $(function(){
                $('#getValues').click(function(){
                    //This works, but I don't want to select the iframe by the number since I don't know it.
                    console.log(
                        window.frames[1],
                        window.frames[1].window,
                        window.frames[1].window.getMe
                    );
                    console.log(
                        window.frames['myIFrame'],
                        window.frames['myIFrame'].document,
                        window.frames['myIFrame'].window,
                        document.getElementById('myIFrame'),
                        document.getElementById('myIFrame').window
                    );
                });
            });
        </script>
    </head>

    <body>
        <button id="getValues">getValues</button>
        <div><iframe src="otherIframe.html"></iframe></div>
        <!-- iframe3_get.html only sets global variable getMe to something. -->
        <div><iframe id="myIFrame" src="iframe3_get.html"></iframe></div>
    </body> 
</html>

with jquery you could try and target the frame by its precise source $('iframe[src="iframe3_get.html"]')... you could loop through window.frames and check the src attr — Joe, Oct 22 '13 at 21:01
@Joe. I think it is easier, but I am not as up to speed with collections and the such. — user1032531, Oct 22 '13 at 21:02
for that matter in a loop you can target whatever attribute youd like — Joe, Oct 22 '13 at 21:03
@epascarello. Okay, but then how do I get a variable within that iframe? — user1032531, Oct 22 '13 at 21:32
@epascarello. I am trying, but am not succeeding. How would I do `alert(window.frames[1].window.getMe);` with using the ID and not the specific frames[] element? — user1032531, Oct 22 '13 at 21:58
Did you replace the `window.frames[1]` part with the `document.getElemetById`... — epascarello, Oct 22 '13 at 21:59
I want to say "Yes!", but I am obviously getting different results than you expect which makes me expect I am not doing it correctly. `console.log(document.getElementById('myIFrame'),document.getElementById('myIFrame').window);` displays ` undefined`. — user1032531, Oct 22 '13 at 22:06
@Joe. Joe, where did you go. Trying to implement your loop through the `window.frames` suggestion. Did you indicate how one would determine the ID of the specific collection? — user1032531, Oct 22 '13 at 22:20
@epascarello Figured out how to check the ID. `for (var i = window.frames.length - 1; i >= 0; i--) {if(window.frames[i].frameElement.id=='plugin-id'){alert('Eureka!');}}` appears to work. Still, this cannot be the "right" way to do this. — user1032531, Oct 22 '13 at 22:28

score 0 · Answer 1 · answered Oct 23 '13 at 12:46

In the bellow example, getM1 and getMe2 will be equal. This doesn't seem to be a very good answer, but it is the only one I have. If it is a bad answer and you elect to vote it down, please provide a better answer.

$('#getValues').click(function(){
    var getMe1=window.frames[1].window.getMe;
    for (var i = window.frames.length - 1; i >= 0; i--) {
        if(window.frames[i].frameElement.id=='myIFrame'){
            var getMe2=window.frames[i].frameElement.getMe;
            break;
        }
    }
});

Another solution is described on http://stackoverflow.com/questions/19565696/get-iframe-of-given-id. It probably is a better solution. — user1032531, Oct 25 '13 at 13:26

Get a variable in an iframe from the parent

1 Answers1