页面嵌套iframe，子框架怎么调用父页面函数

仰望星空 666

于 2025-01-09 10:37:14 发布

阅读量639

点赞数 8

文章标签： jquery 前端

本文链接：https://blog.youkuaiyun.com/smallqiang/article/details/145026644

版权

子框架内调用父页面函数，只需要写上window.parent就可以了。

这是父页面

<!-- 父页面 1.html -->
<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>父页面</title>
    <script src="js/jquery-1.9.1.min.js"></script>
    <script>
        function showMessage() {
            alert('parent message');
        }
    </script>
    
</head>
<body>
    <iframe src="2.html" id="ifr1"></iframe>
</body>
</html>

这是子框架

<!-- 子框架 2.html -->
<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>子iframe</title>
    <script src="js/jquery-1.9.1.min.js"></script>
    <script>    	
        function callParentMethod() {
						window.parent.showMessage();
        }
    </script>
    
</head>
<body>
    <button id=btn2 onclick="callParentMethod()">调用父页面的方法</button>
</body>
</html>