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 相关文章推荐
javascript基础知识大集锦(二) 推荐收藏
Jan 13 Javascript
javascript克隆对象深度介绍
Nov 20 Javascript
jquery操作cookie插件分享
Jan 14 Javascript
js实现日期级联效果
Jan 23 Javascript
Javascript的setTimeout()使用闭包特性时需要注意的问题
Sep 23 Javascript
javascript实现超炫的向上滑行菜单实例
Aug 03 Javascript
jQuery实现TAB选项卡切换特效简单演示
Mar 04 Javascript
JavaScript无缝滚动效果的实例代码
Mar 27 Javascript
JS获取当前时间的实例代码(昨天、今天、明天)
Nov 13 Javascript
jquery+php后台实现省市区联动功能示例
May 23 jQuery
解决layui调用自定义方法提示未定义的问题
Sep 14 Javascript
使用JavaScript实现贪吃蛇游戏
Sep 29 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
杏林同学录(二)
2006/10/09 PHP
php数组相加 array(“a”)+array(“b”)结果还是array(“a”)
2012/09/19 PHP
laravel 4安装及入门图文教程
2014/10/29 PHP
使用PHP生成二维码的方法汇总
2015/07/22 PHP
Smarty模板常见的简单应用分析
2016/11/15 PHP
PHP文件与目录操作示例
2016/12/24 PHP
PHP之多条件混合筛选功能的实现方法
2019/10/09 PHP
php模拟实现斗地主发牌
2020/04/22 PHP
JS网络游戏-(模拟城市webgame)提供的一些例子下载
2007/10/14 Javascript
用 Javascript 验证表单(form)中多选框(checkbox)值
2009/09/08 Javascript
javascript的onchange事件与jQuery的change()方法比较
2009/09/28 Javascript
使用隐藏的new来创建对象
2011/03/29 Javascript
jquery 卷帘效果实现代码(不同方向)
2013/02/05 Javascript
node.js中的http.response.end方法使用说明
2014/12/14 Javascript
JavaScript常用的弹出广告及背投广告实现方法
2015/02/06 Javascript
利用JS实现页面删除并重新排序功能
2016/12/09 Javascript
Javascript this 函数深入详解
2016/12/13 Javascript
Javascript实现登录记住用户名和密码功能
2017/03/22 Javascript
使用原生js封装的ajax实例(兼容jsonp)
2017/10/12 Javascript
详解开发react应用最好用的脚手架 create-react-app
2018/04/24 Javascript
详解Vue+axios+Node+express实现文件上传(用户头像上传)
2018/08/10 Javascript
js获取本日、本周、本月的时间代码
2020/02/01 Javascript
微信小程序开发(三):返回上一级页面并刷新操作示例【页面栈】
2020/06/01 Javascript
Antd的table组件表格的序号自增操作
2020/10/27 Javascript
Nest.js 授权验证的方法示例
2021/02/22 Javascript
利用Python脚本实现ping百度和google的方法
2017/01/24 Python
详解python上传文件和字符到PHP服务器
2017/11/24 Python
浅谈python函数调用返回两个或多个变量的方法
2019/01/23 Python
树莓派4B+opencv4+python 打开摄像头的实现方法
2019/10/18 Python
Python any()函数的使用方法
2019/10/28 Python
10分钟理解CSS3 Grid布局
2018/12/20 HTML / CSS
css3 实现滚动条美化效果的实例代码
2021/01/06 HTML / CSS
Under Armour安德玛荷兰官网:美国高端运动科技品牌
2019/07/10 全球购物
2014年教师工作总结
2014/11/10 职场文书
2014年财务人员工作总结
2014/11/11 职场文书
巧用 -webkit-box-reflect 倒影实现各类动效(小结)
2021/04/22 HTML / CSS