js window.opener 子页面 父页面 传值

JavaScript010

js window.opener 子页面 父页面 传值,第1张

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方法”的文字链,即可成功弹出提示。

在框架页通过parent就可以对父窗口内元素进行操作。

思路:

建两个普通HTML页,a.html 、b.html

## a.html code##

<input type="text" id="name" value="" />

<iframe src="b.html" width="100%" height="200"></iframe>

## b.html code##

<script type="text/javascript">

function fuck(){

parent.document.getElementById('name').value='框架页向父窗口元素赋值!'

}

</script>

这是被框架页面!

<input type="button" value="点我一下" onclick="fuck()" />