js子页面调用父页面方法

 时间:2026-02-14 05:50:43

1、建立父级页面

首先建立一个父级页面parent.html,代码如图,一个pop函数方法,一个链接到child.html的iframe标签;

js子页面调用父页面方法

2、建立子页面

再新建一个child.html页面,如图,展示一个id=link的div标签,和link的点击事件,因为是调用父级方法,所以需要用到window.parent.pop()方法。

js子页面调用父页面方法

3、预览页面

预览页面,可明显看到parent.html里面的iframe框架,指向的就是child子页面

js子页面调用父页面方法

4、错误提示

点击页面中“调用父级pop方法”的文字链,会提示错误,这是因为没配置好域名等相关设置。

js子页面调用父页面方法

5、站点配置

打开iis,右键iframe文件夹——“管理文件夹”——“浏览”;即可打开本地测试地址;(如小伙伴没配置iis,需要先配置iis建立站点)

js子页面调用父页面方法

6、成功调用父级方法

再次点击“调用父级pop方法”的文字链,即可成功弹出提示;

js子页面调用父页面方法

1、新建父页面

同样新建一个parent.html,创建一个pop方法和openchild方法,如图所示,child.html换成用open形式打开。

js子页面调用父页面方法

2、新建子页面

同样新建一个child.html页面,如图,创建一个id=link的div标签和点击事件,因为是open方法打开的子页面,想调用父级,需要用到window.opener.pop()方法。

js子页面调用父页面方法

3、浏览页面

浏览parent页面,并点击“父页面用open方式打开子页面”文字链;

js子页面调用父页面方法

4、成功调用

这时就会弹出child子页面,再点击“调用父级pop方法”文字链,即可调用父页面的pop方法,如图所示;

js子页面调用父页面方法

js子页面调用父页面方法

  • 如何删除不再在 Windows10 中使用的账户
  • Ps如何添加“渐变叠加”图层样式
  • Photoshop CC制作扑克牌图案(一)绘制梅花
  • Photoshop怎么设置显示菜单颜色
  • unity如何点击AR识别出的模型
  • 热门搜索
    生物手抄报图片 夏洛的网手抄报 我让妈妈露笑脸手抄报 生态文明手抄报内容 小学生反邪教手抄报 初中语文手抄报 追逐梦想手抄报 手抄报春天 一年级手抄报图片 小学心理健康手抄报