在网页开发中，`iframe`（内联框架）通常用于在当前页面中嵌入另一个文档。从`iframe`中调用父窗口的JavaScript函数可以使用`parent`关键字来实现，这个关键字指向了嵌入`iframe`的父窗口。不过，需要注意的是，出于安全考虑（同源策略），只有当父窗口和`iframe`中的内容是同源的（即协议、域名和端口都相同）时，才能够进行这种操作。

下面是一个在`iframe`中调用父窗口函数的例子：

首先，假设你在父页面定义了一个函数：

```html

<!DOCTYPE html>
<html>
<head>
    <title>父页面</title>
    <script>
        function parentFunction() {
            alert('这是父页面的函数!');
        }
    </script>
</head>
<body>
    <iframe src="iframe.html" width="300" height="200"></iframe>
</body>
</html>
```

然后，在`iframe`内部的页面中调用这个函数：

```html

<!DOCTYPE html>
<html>
<head>
    <title>iframe 页面</title>
    <script>
        function callParentFunction() {
            parent.parentFunction();
        }
    </script>
</head>
<body>
    <button onclick="callParentFunction()">调用父页面函数</button>
</body>
</html>
```

在这个例子中，当用户点击`iframe`页面中的按钮时，将会调用定义在父页面上的`parentFunction`函数，从而显示一个弹窗。

需要注意的是，在实际使用中，由于浏览器的安全策略，可能会有跨域限制，所以在不同域之间进行此类操作可能会导致安全错误。 若要在不同域的`iframe`和父窗口之间进行通信，可以使用`window.postMessage`方法来安全地实现。

如何从 iframe 中调用父窗口的函数？

1个答案

你的答案