zoukankan      html  css  js  c++  java
  • iframe 父子页面的传值和方法的调用

    (1)父页面获取iframe中的元素值:


    //根据iframe的id获取对象
    var iframe = window.frames['iframeId'];
    //var iframe =window.frames[0];也可以
    //获取iframe中的元素值
    var val=iframe.document.getElementById("t1").value


    (2)在iframe中获取父页面中的元素值:


    var val = parent.document.getElementById("txt1");  


    (3)a包含2个iframe分别为b,c,现在从b中获取c中的元素的值:

    var i1 = parent.window.frames['iframeId'];
    var val = i1.document.getElementById("text1").value;

    ===========================================================================
    iframe父子页面 互相调用js的方法

    父页面: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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>parent</title>
    <script>
     function parentFunction() {
      alert('function in parent');
     }

     function callChild() {
      child.window.childFunction();
      /*
      child 为iframe的name属性值,
      不能为id,因为在FireFox下id不能获取iframe对象
      */
     }
    </script>
    </head>
    <body>
    <input type="button" name="call child"  value="call child" onclick="callChild()"/>
    <br/><br/>
    <iframe name="child" src="./child.html" ></iframe>
    </body>
    </html>

    子页面:child.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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>child</title>
    <script>
     function childFunction() {
      alert('function in child');
     }

     function callParent() {
      parent.parentFunction();
     }
    </script>
    </head>
    <body>
    <input type="button" name="call parent" value="call parent" onclick="callParent()"/>
    </body>
    </html>

    参考文件:http://www.netingcn.com/iframe-js-function-call.html

  • 相关阅读:
    设计模式-代理模式
    设计模式-策略模式
    设计模式-单例模式
    优先队列
    n!中质因子个数
    计算组合数
    高精度
    memset用法
    质因子分解
    素数筛法
  • 原文地址:https://www.cnblogs.com/qylbg/p/3394637.html
Copyright © 2011-2022 走看看