• html中 iframe子页面 与父页面之间的方法调用 ;


    <!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="调用子页面的方法"  onclick="btnClick()"/> 
        </div>
        <div style="margin:auto;">
           <iframe style="300px; height:300px;" id="childframe" src="ChildPage.html"></iframe>
        </div>
    </body>
    </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="调用父页面的方法" onclick="btnClick()"/> 
        </div>
    </body>
    </html>
  • 相关阅读:
    权限管理
    书城项目第五阶段---book表的curd
    大话设计模式学习
    数据绑定流程分析
    GO 解决使用bee工具,报 bash: bee: command not found
    VScode插件:Todo Tree
    ant design pro如何实现分步表单时,返回上一步值依然被保存
    React开发流程
    为什么函数式组件没有生命周期?
    html2canvas@^1.0.0-rc.1
  • 原文地址:https://www.cnblogs.com/jungege/p/6283349.html
Copyright © 2020-2023  润新知