zoukankan      html  css  js  c++  java
  • js子窗口和父窗口交互

    1.父窗口传递信息给子窗口
    程序代码

    1.父窗口传递信息给子窗口
    程序代码
    <script language=javascript>
    
    function outPut(){
       //获取父窗口的文本信息赋值给text
       var text = document.abc.text.value;
       //打开子窗口,并且把操作句柄赋值给win变量,以下所有操作都是针对win对象的
    var win = window.open("","mywin", "menubar=no,width=400,height=100,resizeable=yes");
        //输出基本信息
       win.document.writeln("<title>输出结果</title>");
        win.document.writeln("你的信息是:<p>");
        //输出从父窗口获取的信息
       win.document.writeln(text);
        win.document.close();
        win.focus();
    }
    </script>
    <form name=abc method=post>
    <input type=text name=text size=50>
    //调用上面的函数
    <input type=button value=提交 onClick="outPut()">
    
    </form>

    2.子窗口传递参数给父窗口
    程序代码

    <script language=javascript>
    
    function outPut(){
        var text = document.abc.text.value;
        var win = window.open("","mywin", "menubar=no,width=400,height=100,resizeable=yes");
       win.document.writeln("<title>输出结果</title>");
       win.document.writeln("你的信息是:<p>");
       win.document.writeln(text);
       win.document.writeln("<input type=text name=child value=子窗口信息>");
    
       //对子窗口本身操作,使用self对象,对父窗口操作使用opener对象,这是关键
      //把子窗口中表单的值回传给父窗口,取代父窗口表单以前的值,然后关闭子窗口
      win.document.writeln("<input type=button value=关闭自己 onClick='window.opener.abc.text.value=self.child.value;self.close()'>");
      //可以控制关闭父窗口
      win.document.writeln("<input type=button value=关闭父窗口    onClick='window.opener.opener=null;window.opener.close()'>");
      //刷新父窗口
      win.document.writeln("<input type=button value=刷新父窗口 onClick='window.opener.location.reload()'>");
    
      win.document.close();
      win.focus();
    }
    </script>
    <form name=abc method=post>
    <input type=text name=text size=50>
    <input type=button value=提交 onClick="outPut()">
    
    </form>
  • 相关阅读:
    问题解决-Plugin with id 'com.github.dcendents.android-maven' not found
    hadoop 04 一 HA高可用配置
    hadoop 03 一 Hadoop机架感知配置
    Windows平台安装配置Hadoop
    hadoop 02一 hadoop配置
    hadoop 01一 hadoop安装配置
    Centos7下载和安装教程
    mysql 命令行导出数据
    RabbitMQ 集群部署(linux-centos6.5)
    Spring 集成RabbitMq
  • 原文地址:https://www.cnblogs.com/yaowukonga/p/2873047.html
Copyright © 2011-2022 走看看