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 相关文章推荐
仅IE支持clearAttributes/mergeAttributes方法使用介绍
May 04 Javascript
javascript中innerText和innerHTML属性用法实例分析
May 13 Javascript
js实现超酷的照片墙展示效果图附源码下载
Oct 08 Javascript
jQuery实现从身份证号中获取出生日期和性别的方法分析
Feb 25 Javascript
基于jquery编写的放大镜插件
Mar 23 Javascript
jQuery中Datatables增加跳转到指定页功能
Feb 08 Javascript
浅谈angularjs依赖服务注入写法的注意点
Apr 24 Javascript
VUE元素的隐藏和显示(v-show指令)
Jun 23 Javascript
React Native预设占位placeholder的使用
Sep 28 Javascript
vue 全选与反选的实现方法(无Bug 新手看过来)
Feb 09 Javascript
在 Typescript 中使用可被复用的 Vue Mixin功能
Apr 17 Javascript
vue权限路由实现的方法示例总结
Jul 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
JavaScript Archive Network 集合
2007/05/12 Javascript
javascript实现面向对象类的功能书写技巧
2010/03/07 Javascript
jquery+ajax每秒向后台发送请求数据然后返回页面的代码
2011/01/17 Javascript
分享20多个很棒的jQuery 文件上传插件或教程
2011/09/04 Javascript
jquery 插件学习(五)
2012/08/06 Javascript
jquery验证手机号码、邮箱格式是否正确示例代码
2013/07/28 Javascript
jquery对象和DOM对象的区别介绍
2013/08/09 Javascript
js实现单行文本向上滚动效果实例代码
2013/11/28 Javascript
jQuery实现批量判断表单中文本框非空的方法(2种方法)
2015/12/09 Javascript
JavaScript 闭包详细介绍
2016/09/28 Javascript
BootStrop前端框架入门教程详解
2016/12/25 Javascript
微信小程序遇到修改数据后页面不渲染的问题解决
2017/03/09 Javascript
Angular.js 4.x中表单Template-Driven Forms详解
2017/04/25 Javascript
nodejs socket实现的服务端和客户端功能示例
2017/06/02 NodeJs
vue.js框架实现表单排序和分页效果
2017/08/09 Javascript
javascript Function函数理解与实战
2017/12/01 Javascript
10行原生JS实现文字无缝滚动(超简单)
2018/01/02 Javascript
微信小程序slider组件使用详解
2018/01/31 Javascript
AngularJS创建一个上传照片的指令实例代码
2018/02/24 Javascript
详解从买域名到使用pm2部署node.js项目全过程
2018/03/07 Javascript
json数据传到前台并解析展示成列表的方法
2018/08/06 Javascript
基于VUE实现的九宫格抽奖功能
2018/09/30 Javascript
vue使用代理解决请求跨域问题详解
2019/07/24 Javascript
python解析json实例方法
2013/11/19 Python
使用Python编写vim插件的简单示例
2015/04/17 Python
Ubuntu下安装PyV8
2016/03/13 Python
Python爬虫PyQuery库基本用法入门教程
2018/08/04 Python
Django中reverse反转并且传递参数的方法
2019/08/06 Python
tensorflow将图片保存为tfrecord和tfrecord的读取方式
2020/02/17 Python
2013年学期结束动员演讲稿
2014/01/07 职场文书
大学生暑期实践感言
2014/02/26 职场文书
大学生找工作求职信
2014/07/09 职场文书
玄武湖导游词
2015/02/05 职场文书
2016党校学习心得体会
2016/01/07 职场文书
golang内置函数len的小技巧
2021/07/25 Golang
Java十分钟精通进阶适配器模式
2022/04/06 Java/Android