ifram子页面与父页面的方法相互调用

最新推荐文章于 2024-08-11 18:40:36 发布

weixin_30782293

最新推荐文章于 2024-08-11 18:40:36 发布

阅读量185

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/lgnblog/p/11010981.html

版权

parent.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Parent Page</title>
    <script language="javascript" type="text/javascript">
         function parenttest() {
             alert("这是父页面的方法！");
         }
         function btnClick() {
             document.getElementById("childframe").contentWindow.childtest();
         }
    </script>
</head>
<body>
   <div style="margin:auto;">
       <h1>This is the Parent Page.</h1>
       <input type="button" value="调用子页面的方法"  οnclick="btnClick()"/> 
    </div>
    <div style="margin:auto;">
       <iframe style="width:300px; height:300px;" id="childframe" src="ChildPage.html"></iframe>
    </div>
</body>
</html>

son.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
　　<head>
　　　　<title>Child Page</title>
　　　　<script language="javascript" type="text/javascript">
　　　　　　function childtest() {
　　　　　　　　alert("这是子页面的方法！");
　　　　　　}

　　　　　　function btnClick() {
　　　　　　　　window.parent.parenttest();
　　　　　　}
　　　　</script>
　　</head>
　　<body>
　　　　<div style="margin:auto;">
　　　　　　<h1>This is the Child Page.</h1>
　　　　　　<input type="button" value="调用父页面的方法" οnclick="btnClick()" />
　　　　</div>
　　</body>
</html>

转载于:https://www.cnblogs.com/lgnblog/p/11010981.html

weixin_30782293

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ifram子页面与父页面的方法相互调用

parent.html<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" >&...
复制链接

扫一扫