javascript - 如何从子窗口调用 javascript 函数到主窗口中的 iframe？

Question

我有一个主文件：index.php 它有 1 个 iframe：main

<iframe src="main.php" id="main_frame" name="main_frame" >
</iframe>

main.php 有 2 个 iframe：middle_frame 和 top_frame

<iframe src="middle.php" id="middle_frame" name="middle_frame"  >
</iframe>

<iframesrc="pageTop.php" id="top_frame" name="top_frame"  >
</iframe> 

middle.php 有 2 个 iframe ： middle_left_frame ， middle_right_frame

<iframe src="middle_left.php" id="middle_left_frame" name="middle_left_frame"  >
</iframe>

<iframe  src="middle_right.php" id="middle_right_frame" name="middle_right_frame" >
</iframe>

Button1JSClick当我只运行 middle_left.php 时，我可以通过这种方式从子窗口调用 javascript 函数：

opener.Button1JSClick(event);

但是，当我运行到 index.php 和其他文件时，我不能使用这种方式。

我该怎么做？

Answer 1

iframe 中没有开场白。

尝试window.Button1JSClick(event);或top.Button1JSClick(event);用于最顶层的窗口，parent.Button1JSClick(event);向上一层（top向下一层）

但是，由于您使用的是 jQuery，请将页面加载到具有相关溢出的 div 中

<div id="content">
  <div data-src="main.php" id="main_frame">
    <div data-src="pageTop.php" id="top_frame"></div> 
    <div data-src="middle.php" id="middle_frame">
      <div data-src="middle_left.php" id="middle_left_frame"></div>
      <div data-src="middle_right.php" id="middle_right_frame"></div>
    </div>
  </div>
</div>

使用类似的东西

$(function() {
  $("div").each(function() {
    var src= $(this).data("src");
    if (src) {
      if (this.id==="middle-left-frame") {
        $(this).load(src,function() { Button1JSClick() });
      }
      else $(this).load(src);
    }
  });
});