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


Posted in Javascript onMay 28, 2016

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

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获取子窗口中返回的数据实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery struts 验证唯一标识(公用方法)
Mar 27 Javascript
jquery查找父元素、子元素(个人经验总结)
Apr 09 Javascript
jquery文本框中的事件应用以输入邮箱为例
May 06 Javascript
使用javascript实现Iframe自适应高度
Dec 24 Javascript
jQuery中click事件用法实例
Dec 26 Javascript
javascript中Array数组的迭代方法实例分析
Feb 04 Javascript
JavaScript跨平台的开源框架NativeScript
Mar 24 Javascript
JS实现带鼠标效果的头像及文章列表代码
Sep 27 Javascript
JavaScript SHA1加密算法实现详细代码
Oct 06 Javascript
js实现移动端导航点击自动滑动效果
Jul 18 Javascript
JS获取url参数,JS发送json格式的POST请求方法
Mar 29 Javascript
Vue.js 中取得后台原生HTML字符串 原样显示问题的解决方法
Jun 10 Javascript
Bootstrap自动适应PC、平板、手机的Bootstrap栅格系统
May 27 #Javascript
Bootstrap3.0学习教程之JS折叠插件
May 27 #Javascript
全面解析多种Bootstrap图片轮播效果
May 27 #Javascript
bootstrap-wysiwyg结合ajax实现图片上传实时刷新功能
May 27 #Javascript
极力推荐一款小巧玲珑的可视化编辑器bootstrap-wysiwyg
May 27 #Javascript
所见即所得的富文本编辑器bootstrap-wysiwyg使用方法详解
May 27 #Javascript
非常酷炫的Bootstrap图片轮播动画
May 27 #Javascript
You might like
PHP中使用BigMap实例
2015/03/30 PHP
编写PHP脚本过滤用户上传的图片
2015/07/03 PHP
作为程序员必知的16个最佳PHP库
2015/12/09 PHP
PHP面向对象五大原则之单一职责原则(SRP)详解
2018/04/04 PHP
PHP的PDO预定义常量讲解
2019/01/24 PHP
jQuery Ajax 全解析
2009/02/08 Javascript
javascript权威指南 学习笔记之javascript数据类型
2011/09/24 Javascript
页面调用单个swf文件,嵌套出多个方法。
2011/11/21 Javascript
浅析jQuery对select操作小结(遍历option,操作option)
2013/07/04 Javascript
JavaScript遍历table表格中的某行某列并打印其值
2014/07/08 Javascript
jquery实现不包含当前项的选择器实例
2015/06/25 Javascript
RequireJS入门一之实现第一个例子
2015/09/30 Javascript
jquery对table做排序操作的实例演示
2017/08/10 jQuery
小程序清理本地缓存的方法
2018/08/17 Javascript
JavaScript实现小球沿正弦曲线运动
2020/09/07 Javascript
状态机的概念和在Python下使用状态机的教程
2015/04/11 Python
使用Python的Django框架实现事务交易管理的教程
2015/04/20 Python
Python中的map()函数和reduce()函数的用法
2015/04/27 Python
简单介绍使用Python解析并修改XML文档的方法
2015/10/15 Python
使用实现XlsxWriter创建Excel文件并编辑
2018/05/04 Python
详解Python 数据库的Connection、Cursor两大对象
2018/06/25 Python
python3 批量获取对应端口服务的实例
2019/07/25 Python
python垃圾回收机制(GC)原理解析
2019/12/30 Python
python实现提取COCO,VOC数据集中特定的类
2020/03/10 Python
深入研究HTML5实现图片压缩上传功能
2016/03/25 HTML / CSS
HTML5是什么 HTML5是什么意思 HTML5简介
2012/10/26 HTML / CSS
24个canvas基础知识小结
2014/12/17 HTML / CSS
adidas泰国官网:adidas TH
2020/07/11 全球购物
个人作风剖析材料
2014/02/02 职场文书
推广活动策划方案
2014/08/23 职场文书
群众路线组织生活会发言材料
2014/10/17 职场文书
2015年乡镇工作总结范文
2015/04/22 职场文书
2015年服务员个人工作总结
2015/05/27 职场文书
田径运动会通讯稿
2015/07/18 职场文书
选择比努力更重要?这是长期以来对“努力”的最大误解
2019/07/12 职场文书
Appium中scroll和drag_and_drop根据元素位置滑动
2022/02/15 Python