Как родительский фрейм обращается к дочернему фреймному окну? - PullRequest
0 голосов
/ 14 мая 2018

В приведенном ниже коде:

    <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="utf-8">    
      </head>
      <body>

        <iframe srcdoc="<script>
                            window.innerStr='xyz';
                        </script>" >
        </iframe>

        <script>

            function test() {
                let iframe = window.frames[0];
                console.log('frames innerStr: ' + iframe.innerStr); // does not work if child frame says innerStr = 'xyz' without window scope
            }
            window.onload = test;  
            test();
        </script>
      </body>
    </html>

Для window.innerStr='xyz';, без использования области действия window в дочернем фрейме, родительский фрейм не может получить доступ к свойству дочернего фрейма (innerStr)

Обязательно ли масштабирование окна для кодирования JS?window.open('file.html') имеет похожие результаты.

1 Ответ

0 голосов
/ 14 мая 2018

Вы можете использовать сообщения для общения от родителя с iframe.

Поместить этот код в родительский

// Create IE + others compatible event handler
var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var eventer = window[eventMethod];
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";

// Listen to message from child window
eventer(messageEvent,function(e) {
    // e.data = "foo"
    doStuff(e.data);
},false);

function doStuff(data){
    console.log(data);
}

Поместить этот код в iframe

var someVarible = "foo"
parent.postMessage(someVarible, "https://urlofsite.com");

РЕДАКТИРОВАТЬ Чтобы заставить его работать с кодом, который у вас уже есть.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
</head>
<body>

<iframe srcdoc="<script>let innerStr='xyz';window.parent.test(innerStr);</script>">
</iframe>

<script>

    function test(foo) {
        var iframe = window.frames[0];
        console.log('frames innerStr: ' + foo)
    }
</script>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...