JS获取子窗口中返回的数据实现方法

更新时间：2016年05月28日 08:53:34 投稿：jingxian

下面小编就为大家带来一篇JS获取子窗口中返回的数据实现方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧

在开发的时候，遇到了这样一个问题，客户填写自己的收货地址，可以新建，但同时也可以选择之前填写的，由于我们的客户本身就是商户，地址繁多，把它之前的地址简单用个下拉框罗列出来显然不合适，并且客户要求能够对地址通过姓名筛选，这样，选择地址就必须再开一个小窗来完成了，那么，小窗中填写的值怎么回传呢？

js有个方法showModalDialog在这种情况下用的就比较多了，其作用是打开一个模态窗口，什么事模态窗口？就是打开后不能操作父窗口，只有子窗口操作完了，关闭了，才可以继续父窗口的动作。回到最开始的问题的话，就是给一个地址选择入口，点击触发事件btn_click()。

父窗口JS

function btn_click() 
{ 
      var returnValue = window.showModalDialog('chooseAddr.aspx', window, 'dialogWidth=500px;dialogHeight=600px;status=no'); 
 
      if (vReturnValue !== "" && vReturnValue !== undefined) 
      { 
        //处理子窗口的返回值 
      } 
 }

子窗口中，在用户完成筛选选择等一系列动作以后，确定时，触发事件returnVal()。

function returnVal() 
{ 
      var rtArr = new Array(); 
      rtArr[0] = "test0"; 
      rtArr[1] = "test1"; 
      window.returnValue = retArr; 
 
      window.close();//关掉子窗口，才能继续父窗口的操作 
}

这样，就完成了父子窗口的“数据互动”，对了，父窗口怎么向子窗口传值呢，在本例下，我们需要知道操作用户的id才能给他选择自己之前填写过的地址，只需在

window.showModalDialog的第一个参数，即打开的子窗口地址中加上参数?id=xxx，没错get方式传过去就OK了。

以上这篇JS获取子窗口中返回的数据实现方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

自己写一个uniapp全局弹窗(APP端)
应用uni-app跨平台框架进行项目开发过程中,需要实现版本更新时全页面弹窗,底部导航栏无法点击的效果,下面这篇文章主要给大家介绍了关于uniapp全局弹窗(APP端)的相关资料,需要的朋友可以参考下
2022-10-10
javascript实现选中复选框后相关输入框变灰不可用的方法
这篇文章主要介绍了javascript实现选中复选框后相关输入框变灰不可用的方法,涉及javascript针对页面元素属性的相关操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2015-08-08
原生JS实现音乐播放器的示例代码
这篇文章主要介绍了原生JS实现音乐播放器的示例代码，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2021-02-02
js实现限定范围拖拽的示例
这篇文章主要介绍了js实现限定范围拖拽的示例，帮助大家更好的制作js特效，美化自己的网页，感兴趣的朋友可以了解下
2020-10-10
Layui数据表格之获取表格中所有的数据方法
今天小编就为大家分享一篇Layui数据表格之获取表格中所有的数据方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2018-08-08
详解JavaScript的内存空间、赋值和深浅拷贝
这篇文章主要介绍了JavaScript的内存空间、赋值和深浅拷贝，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2019-04-04
使用JS读取XML文件的方法
由于项目上需要解析xml，于是各种百度，然后自己总结了下各个主流浏览器解析xml的方法，下面通过本文给大家详细介绍下使用JS读取XML文件的方法，一起看看吧
2016-11-11
JS去除字符串最后的逗号实例分析【四种方法】
这篇文章主要介绍了JS去除字符串最后的逗号,结合实例形式分析了四种字符串遍历、截取的操作方法,需要的朋友可以参考下
2019-06-06
JS实现跟随鼠标闪烁转动色块的方法
这篇文章主要介绍了JS实现跟随鼠标闪烁转动色块的方法,涉及javascript操作html元素及css样式的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2015-02-02
ES6中Array.copyWithin()函数的用法实例详解
ES6为Array增加了copyWithin函数，用于操作当前数组自身，用来把某些个位置的元素复制并覆盖到其他位置上去。下面重点给大家介绍ES6中Array.copyWithin()函数的用法，需要的朋友参考下
2017-09-09