1

如果父窗口和 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 的函数。

为了更清楚，我希望在 iframe 上使用此代码：

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

然后我希望能够拜访myFunction(postMe);父母...

注意：由于某些原因，HTMLIFrameElement.contentWindow我无法选择 iframe 。window.frames['name']

最终目标是：我想多次传递一个变量，每次我想从父级到 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 运行，我不能调用函数并从父级传递变量。

4

1 回答 1

1

您可以将函数对象从 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); 
}
于 2019-06-05T07:53:54.900 回答