1、首先建立一个父级页面parent.html,代码如图,一个pop函数方法,一个链接到child.html的iframe标签。
2、再新建一个child.html页面,如图,展示一个id=link的div标签,和link的点击事件,因为是调用父级方法,所以需要用到window.parent.pop()方法。
3、预览页面,可明显看到parent.html里面的iframe框架,指向的就是child子页面。
4、点击页面中“调用父级pop方法”的文字链,会提示错误,这是因为没配置好域名等相关设置。
5、打开iis,右键iframe文件夹——“管理文件夹”——“浏览”;即可打开本地测试地址;(如小伙伴没配置iis,需要先配置iis建立站点)。
6、再次点击“调用父级pop方法”的文字链,即可成功弹出提示。
//主页定义方法:
function addUserComplete( username ){
console.log(' user add ok : ' + username);
}
//在iframe定义方法:
function addUserSubmit(){
//TODO: ajax call
//on succ
window.parent.addUserComplete('the new username');
}
子页面调用父页面函数只需要写上window.praent就可以了。比如调用a()函数,就写成:
代码如下:
window.parent.a();
子页面取父页面中的标签中的值,比如该标签的id为“test”,则:
代码如下:
window.parent.document.getelementbyid("test").value;
jquery方法为:
$(window.parent.document).contents().find("test").val();
js应该是不能实现的吧,子页面调用父页面的方法不存在的。
但是你可以通过服务器端来做,服务器接受到子页面提交的信息的时候,把得到的信息推送给父页面。
如果是iframe,或window.open打开的子页,就用parent.父页面定义的方法。
如果是其它的UI。方法不一定相同。