子页面调用父页面方法（js子窗口调用父窗口方法）

本文目录一览：

• 1、iframe子页面在跨域情况下使用父页面的方法
• 2、frame怎么在子页面里调用父页面js方法
• 3、vue子页面调用父页面方法

iframe子页面在跨域情况下使用父页面的方法

项目中，iframe内部的子页面要使用父页面的方法，如果不跨域，那么直接通过parent.func()就可以直接调用了。但如果子页面和父页面跨域了，就需要用html5的tMessage方法来进行通信和传输数据，间接性的在父页面调用方法。

子页面调用父页面方法（js子窗口调用父窗口方法）

以子页面向父页面通信为例：

子页面中

父页面中这样接收

ie8兼容

1、绑定需兼容

由于ie8中不兼容addEventListener()这种方式，所以需要这样来绑定

2、子页面向父页面传的数据为json字符串，即JSON.stringify后的字符串内容

需要用window.eval()() 或 new Function(){} 的方式解析 JSON 格式字符串。

frame怎么在子页面里调用父页面js方法

子页面调用父页面函数只需要写上window.praent就可以了。比如调用a()函数，就写成：

代码如下:

window.parent.a();

子页面取父页面中的标签中的值，比如该标签的id为“test”,则：

代码如下:

window.parent.document.getElementById("test").value;

jQuery方法为：

$(window.parent.document).contents().find("test").val();

vue子页面调用父页面方法

种方法是直接在子组件中通过this.$parent.nt来调用父组件的方法

父组件

子页面

第二种方法是在子组件里用$emit向父组件触发一个，b了。

父组件

子组件

第三种是父组件把方法传入子组件中，在子组件里直接调用这个方法

父组件

子组件