iframe跨域互相调用（父调子）

Tetai

于 2018-12-20 19:33:02 发布

阅读量793

点赞数

本文介绍了一种通过在子iframe中创建中间HTML文件实现跨iframe通信的方法。关键步骤是在父iframe中动态生成一个iframe并指向该中间HTML文件，该文件内部调用子iframe中的特定方法，如saveReportDataToJson，实现数据的传递。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

核心思想：在子iframe域创建一个中间HTML文件，在父iframe调用之前先动态生成一个iframe，并且src指向中间的HTML文件，在HTML文件里面调用子iframe的方法.

中间HTML文件：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<script type="text/javascript">  
    parent.window.myiframe.saveReportDataToJson();
</script> 
</body>
</html>

父iframe：

// 调用iframe
	            function exec_iframe(){  
	        
  		        var url = "http://127.0.0.1:8888/ms/webapp/login.html
  		        var exec_obj;
		        if(typeof(exec_obj)=='undefined'){  
		            exec_obj = document.createElement('iframe');  
		            exec_obj.name = 'tmp_frame';  
		            exec_obj.src = url;  
		            exec_obj.style.display = 'none';  
		            document.body.appendChild(exec_obj);  
		        }else{  
		            exec_obj.src = url;  
		        }  
		    }

saveReportDataToJson为子iframe的方法