打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
使用JS在父窗体和子窗体间传值
userphoto

2023.02.25 湖南

关注

今天遇到了需要将子窗体的数据传递给父窗体的问题,到网上找了个答案。特分享下。以备不时之需。

1.在父窗体中把子窗体的值带出来

第一种方法:

(1)在父窗体中的代码:

  <html>
  <head>
   <script type="text/javascript">
    function toUrl()
    {
      window.open("你的子窗体页面");
    }
  
   </script>
   </head>
  <body>
  <form id="form1">
    <input type="text" value="" id="text1"/>
    <input type="button" value="打开" onclick="toUrl()">
  </form>
  </body>
</html>

(2)子窗体中的代码

<html>
  <head>
    <script type="text/javascript">
     function goback()
     {

//opener代表了父窗体
       window.opener.document.getElementById("text1").value=document.getElementById("text2").value;
       window.close();
     }
   </script>

 </head>
 
  <body>
    <form id="form1">
      <input type="text" id="text2" value=""/>
      <input type="button" value="回传" onclick="goback()">
    </form>
  </body>
</html>

第二种方法:

(1)在父窗体中的代码:

<html>
  <head>
   <script type="text/javascript">
     function toUrl()
     {
       var a=window.showModalDialog("你的子窗体页面",window);
 
       if(a!="[object]")  //这个地方可以不判断,意义不大
       {
         document.getElementById("text1").value=a;
       }
    
     }
   </script>
   
 

  </head>
 
  <body>
    <form id="form1">
      <input id="text1" type="text" value="">
      <input type="button" id=”button1“ onclick="toUrl()"/>
    </form>
  </body>
</html>

(2)在子窗体中的页面

<html>
  <head>
    <script type="text/javascript">
     function reVal()
     {
       var b=document.getElementById("text2").value;
       window.returnValue=b;
       window.close();
     }
    </script>

  </head>
  <body>
    <form id="form1">
     <input type="text" id="text2" value=""/>
     <input type="button" value="回传" onclick="reVal();"/>
    </form>
  </body>
</html>

2.在子窗体里带出父窗体里的值

(1)父窗体里的代码

<html>
  <head>
    <script type="text/javascript" language="javascript">
       function openwindow()
       {
         
         window.open("你的父窗体页面","_blank");
          }
    </script>
  </head>
 
  <body>

    <input type="text" value="" id="text1">
    <input type="button" value="打开" onclick="openwindow()">
  </body>
</html>

(2)子窗体里的代码

<html>
  <head>
   <script>
    function fun() {
  
     window.opener.document.getElementById("text1").value="info";
 
    
     window.close();
   
}
</script>

  </head>
 
  <body>
  

<input type="button" onclick="fun()" value="aaa">
   
  </body>
</html>

本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
JS自动给文本框的数字加千分位
JS中表单中的几个常见的事件
javascript 句柄传值 两个页面案例
关于子窗体向父窗体传值方法
onBlur事件是什么?
Html父子窗口之间传值
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服