JS模态窗口返回值兼容问题的完美解决方法


Posted in Javascript onMay 28, 2016

因系统要兼容原IE已使用的关闭方法,经调试测得,需对window.dialogArguments进行再较验,不然易出问题。

function OKEnd(vals) {
  if (vals == null) vals = "TRUE";
  if (typeof (window.opener) == "undefined") {
    if (typeof (window.dialogArguments) != "undefined") {
      if (window.dialogArguments && window.dialogArguments != null) {
        window.opener = window.dialogArguments;
        if (window.opener && window.opener != null) {
          window.opener.ReturnValue = vals;
        }
      }
    }
  }
  else {
    if (window.opener && window.opener != null) {
      window.opener.ReturnValue = vals;
    }
  }
  window.returnValue = vals;
  self.close();
}

返回值接收的,只需在原有IE的接收模式下,多较验一下opener就可以了,如下:

//选择变更部门
     function SetOrganizeTree2() { var url="弹出页面";
       var ret = window.showModalDialog(url, window, "dialogWidth=400px;dialogHeight=500px;status=no;help=no;scroll=yes;resizable=yes;");
       if (typeof (ret) == "undefined") {
         ret = window.ReturnValue;
       }
       if (ret) {
         document.getElementById("hidDeptCode2").value = ret;
         document.getElementById("btnDeptCodeAdd").click();
       }
       return false;
     }

JS模态窗口返回值兼容问题完美解决方法

1、打开弹出窗口时把 window 作为第二个参数传入。

var result = window.showModalDialog(url, window, "dialogWidth=" + width + "px;dialogHeight=" + height + "px;resizable:yes;")

 if (typeof (result) == 'undefined') {

     result = window.ReturnValue;

   }

   return result;

2、在弹出窗口中,执行如下JS,以接收传入的window

if (typeof (window.opener) == 'undefined') window.opener = window.dialogArguments;

3、弹出窗口关闭前,调用如下JS赋返回值

window.retureValue = vals;

    if (window.opener && window.opener != null)

        window.opener.ReturnValue = vals;

 

    window.close();

原理探讨:

chrome下,标准方法,在弹出页面不回发的情况下,是可以返回值的。 有回发则不能正常返回值。此方法可以解决。

IE下标准方法,有时不明原因不能正确返回值,此方法可解决。

FF未详细测试,应该问题不大。

以上这篇JS模态窗口返回值兼容问题的完美解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
动态添加js事件实现代码
Mar 12 Javascript
Javascript Cookie读写删除操作的函数
Mar 02 Javascript
jquery 学习之二 属性相关
Nov 23 Javascript
jquery实现excel导出的方法
Apr 04 Javascript
jQuery中:input选择器用法实例
Jan 03 Javascript
Jquery中find与each方法用法实例
Feb 04 Javascript
Bootstrap CSS布局之列表
Dec 15 Javascript
微信小程序-小说阅读小程序实例(demo)
Jan 12 Javascript
vue2.0使用Sortable.js实现的拖拽功能示例
Feb 21 Javascript
node上的redis调用优化示例详解
Oct 30 Javascript
前端vue-cli项目中使用img图片和background背景图的几种方法
Nov 13 Javascript
node运行js获得输出的三种方式示例详解
Jul 02 Javascript
js弹出窗口返回值的简单实例
May 28 #Javascript
JS获取子窗口中返回的数据实现方法
May 28 #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
You might like
为了这两部电子管收音机,买了6套全新电子管和10粒刻度盘灯泡
2021/03/02 无线电
解析CI即CodeIgniter框架在Nginx下的重写规则
2013/06/03 PHP
解析PHP实现多进程并行执行脚本
2013/06/18 PHP
解析:通过php socket并借助telnet实现简单的聊天程序
2013/06/18 PHP
PHP常用的排序和查找算法
2015/08/06 PHP
WordPress中用于获取及自定义头像图片的PHP脚本详解
2015/12/17 PHP
PHP实现的获取文件mimes类型工具类示例
2018/04/08 PHP
thinkphp集成前端脚手架Vue-cli的教程图解
2018/08/30 PHP
PHP智能识别收货地址信息实例
2019/01/05 PHP
javascript break指定标签打破多层循环示例
2014/01/20 Javascript
Vue 2.0中生命周期与钩子函数的一些理解
2017/05/09 Javascript
vue高德地图之玩转周边
2017/06/16 Javascript
Angular实现下拉框模糊查询功能示例
2018/01/03 Javascript
详解node.js的http模块实例演示
2018/07/12 Javascript
vue发送ajax请求详解
2018/10/09 Javascript
JS回调函数深入理解
2019/10/16 Javascript
Vue使用Three.js加载glTF模型的方法详解
2020/06/14 Javascript
vue 将多个过滤器封装到一个文件中的代码详解
2020/09/05 Javascript
Python探索之SocketServer详解
2017/10/28 Python
Python使用progressbar模块实现的显示进度条功能
2018/05/31 Python
浅谈Python中的全局锁(GIL)问题
2019/01/11 Python
Python代码中如何读取键盘录入的值
2020/05/27 Python
Python读取xlsx数据生成图标代码实例
2020/08/12 Python
简单了解Python字典copy与赋值的区别
2020/09/16 Python
matplotlib之pyplot模块之标题(title()和suptitle())
2021/02/22 Python
移动端html5 meta标签的神奇功效
2016/01/06 HTML / CSS
加拿大约会网站:EliteSingles.ca
2018/01/12 全球购物
Pandora德国官网:购买潘多拉手链、戒指、项链和耳环
2020/02/20 全球购物
采购主管工作职责
2013/12/12 职场文书
人事科岗位职责范本
2014/03/02 职场文书
股权转让意向书
2014/04/01 职场文书
产品发布会策划方案
2014/05/12 职场文书
运动会拉拉队口号
2014/06/09 职场文书
开展党的群众路线教育实践活动情况汇报
2014/11/05 职场文书
卖车协议书范文
2016/03/23 职场文书
Pytorch 统计模型参数量的操作 param.numel()
2021/05/13 Python