zoukankan      html  css  js  c++  java
  • iframe子页面js调用父页面js函数/父页面调用Iframe子页面中js方法

    一、iframe页面里的js调用父级页面js函数

    1、假设当前页面为a.html, iframe的src页面为b.html,其代码如下:

    <html>
    
    <head>
    <title></title>
    </head>
    <body>
      <p>
    iframe页面里的js调用父级页面js函数的demo</p>
      <iframeframeborder="0"width="0"height="0" name="test" src="b.html">
      </iframe>
    <p id="p_nr"></p>

    </body>
    <scripttype="text/javascript">   function testParent(){
    alert('Parent');
    }
    </script>
    </html>

    2、b.html里的页面元素为:

    <html>
    
    <head>
    <title></title>
    </head>
    <body>
    <script
    type='text/javascript'> window.parent.document.getElementById('p_nr').innerHTML ='内容';//控制父级页面的元素 window.parent.testParent();//调用父级页面的Js函数
    </script>

    </body>
    </html>

    二、父页面调用Iframe页面中js方法

    1、test.js内容

    function testJs()

    {

    alert('JS');

    }

    2、Children.html内容

    <html>

    <head>

    <title></title>

    <script type="text/javascript" src="test.js"></script>

    </head>

    <body>

    </body>

    </html>

    3、parent.html内容

    <head>

    <title></title>

    <script type="text/javascript" >

    var obj=self.frames[0];

    obj.testJs();

    </script>

    </head>

    <body>

    </body>

    </html>

  • 相关阅读:
    Spring Boot 内嵌Tomcat的端口号的修改
    仅显示INPUT下边框
    2015面试记三
    2015面试记二
    2015面试记一
    最近工作学习心得体会
    Tomcat批处理文件小结
    启动Tomcat一闪而过——分析及解决过程
    WIN7安装及配置JDK
    Firefox下载文件时中文名乱码问题
  • 原文地址:https://www.cnblogs.com/yongtaiyu/p/3555497.html
Copyright © 2011-2022 走看看