Как я могу вызвать функцию iframe из parent? - PullRequest
0 голосов
/ 05 июня 2019

Если родительский элемент и iframe оба находятся в одном домене, мы можем вызвать функцию родительского окна из iframe:

код iframe:

// here we call 'myFunction' which is a parent function

window.postMe = "postMe value here";
window.parent.myFunction(postMe);

В родительском окнемы можем определить функцию следующим образом:

function myFunction(postMe) {
    ((console&&console.log)||alert)("postMe= " + postMe);
}

И приведенный выше код правильно регистрирует значение "postMe".

Но мой вопрос заключается в том, как я могу вызвать функцию iframe из parent.

Чтобы быть более понятным, я хочу этот код в моем iframe:

 function myFunction(postMe) {
        ((console&&console.log)||alert)("postMe= " + postMe);
    }

, тогда я хочу иметь возможность вызвать myFunction(postMe); для родителя ...

Примечание. По некоторым причинам я не могу выбрать iframe, например HTMLIFrameElement.contentWindow или window.frames['name'].

Конечная цель: я хочу передать переменную несколько раз и каждый раз, когда мне нужно, от parent до iframe.У @CertainPerformance есть решение для этого, которое я не могу заставить его работать.

код iframe:

window.postMeToParent= "post me to parent";
window.parent.myFunction(postMeToParent, (response) => {
  console.log(response);
});

родительский код:

function myFunction(postMeToParent, callback) {
  const postMeToiframe= "post me to iframe";

  // do something with postMeToiframe in parent:
  ((console&&console.log)||alert)(postMeToParent);

  // do something with postMeToiframe in child:
  callback(postMeToiframe);
}

Проблема в том, что этоможно запустить только через iframe, и я не могу вызвать функцию и передать переменные из parent.

1 Ответ

1 голос
/ 05 июня 2019

Вы можете передать объект функции из iframe в родительскую функцию и вызвать ее оттуда.

На родительском элементе:

function tunnel(fn){
     fn('postMe');
}

На iframe:

function myFunction(postMe) {
     ((console&&console.log)||alert)("postMe= " + postMe);
}
window.parent.tunnel(myFunction);

Если ваш родительский документ не будет загружен в этот момент, попробуйте использовать ниже

var parentDocument = window.parent.document; 
$( parentDocument ).ready(function() { 
     window.parent.tunnel(myFunction); 
}
...