您的位置：首页 > 其它

Iframe父页面与子页面之间的相互调用

2017-09-12 17:51 295 查看

父页面：

<!DOCTYPE html>
<html>
<head>
<title>parents</title>
<meta charset="UTF-8">
</head>
<body>

<div id="default">div内容</div>
<iframe src="child.html" id="child"></iframe>

<script language="javascript" type="text/javascript">
　　function sayhello() {
　　　　alert('Hello World!');
　　}
　　var value = 'value';
　　child.contentWindow.test();
</script>

</body>
</html>

子页面：

<!DOCTYPE html>
<html>
<head>
<title>child</title>
<meta charset="UTF-8">
<script language="javascript" type="text/javascript" src="js/jquery.min.js"></script>
<script language="javascript" type="text/javascript">
$(function() {
//在iframe子页面中查找父页面元素
alert($('#default', window.parent.document).html());
//在iframe中调用父页面中定义的变量
alert(parent.value);
//在iframe中调用父页面中定义的方法
parent.sayhello();
});

　　　function test() {
alert('我是子页面!');
}

</script> </head> <body> <div>iframe子页面内容</div> </body> </html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航