1. add <base target="_self" /> in the page of dialog, no need to use frame:

<head>

<base target="_self" />

2. add div_conver class in style file

/*-------------------------------- used by dialog.js ----------------------------------------------------------*/.div_cover
{
    z-index:; left:0px; top:0px; width:%; height:%; position:); opacity:0.6; display:none;
}

3. Modify code get dialog argument. for example, in UserSelector.js

if(window.dialogArguments.insertXML!=null)
{
     GetInsertXML=window.dialogArguments.insertXML;    // Wrong
}

Now: GetInsertXML = window.dialogArguments;

var Dialog = {
    Show: function (url, width, height, objArgument) {
        if (isChrome()) {
            showCover();
        }

        var objArgument = objArgument || window;
        var retValue = window.showModalDialog(url, objArgument, 'scroll=yes;resizable=no;help=no;status=no;center=yes;dialogHeight=' + height + 'px;dialogWidth=' + width + 'px;');
        if (isChrome()) {
            hideCover();
            retValue = window.returnValue;
        }
        )//for IE, convert string to array, IE will lose array when window close
            retValue = retValue.split(",");

        return retValue;
    },

    GetDialogArguments : function(){
        return window.dialogArguments;
    },

    CloseAndReturn: function (v) {
        var retValue;
        if (isIE() && Object.prototype.toString.call(v) === "[object Array]") //for IE, convert array to string, IE will lose array when window close
            retValue = v.join();
        else
            retValue = v;

        if (isChrome()) {
            //for chrome
            window.opener.returnValue = retValue;
            window.close();
        } else {
            window.returnValue = retValue;
            window.close();
        }
    },

    Close: function () {
        window.close();
    }
}

function isIE() {
    ;
}

function isChrome() {
    return navigator.appName == "Netscape";
}

function showCover() {
    setCoverDisplay("block");
}

function hideCover() {
    setCoverDisplay("none");
}

function setCoverDisplay(display) {
    if (document.getElementById("winCover") != null)
        document.getElementById("winCover").style.display = display;

    ].document.getElementById("winCover") != null)
        window.top.frames[].document.getElementById("winCover").style.display = display;

    ].document.getElementById("winCover") != null)
        window.parent.frames[].document.getElementById("winCover").style.display = display;
}

用法：

parent window :

<script type="text/javascript" src="ModalDialog.js"></script>
<script type="text/javascript">
function show() {
var ret = Dialog.Show("dialog.html", 200, 300);
alert("return:" + ret);
}
</script>

dialog:

<script type="text/javascript" src="ModalDialog.js"></script>
<script type="text/javascript">
function rt(s) {
Dialog.CloseAndReturn(s);
}
</script>

//---------------------------------------

框架页面中，div只能覆盖当前框架，解决方法：在各个框架页面中创建一个div(包括topMenu,leftMenu), 当需要现实dialog时，显示各个框架页面中的div

function showCover() {
            document.getElementById("dCover").style.display = "block";
            window.top.frames[].document.getElementById("dCover").style.display = "block";
        }

ModalDialog.js的更多相关文章

  1. Vue.js——vue-resource全攻略

    概述 上一篇我们介绍了如何将$.ajax和Vue.js结合在一起使用,并实现了一个简单的跨域CURD示例.Vue.js是数据驱动的,这使得我们并不需要直接操作DOM,如果我们不需要使用jQuery的D ...

  2. Vue.js——基于$.ajax实现数据的跨域增删查改

    概述 之前我们学习了Vue.js的一些基础知识,以及如何开发一个组件,然而那些示例的数据都是local的.在实际的应用中,几乎90%的数据是来源于服务端的,前端和服务端之间的数据交互一般是通过ajax ...

  3. Vue.js——60分钟组件快速入门（下篇）

    概述 上一篇我们重点介绍了组件的创建.注册和使用,熟练这几个步骤将有助于深入组件的开发.另外,在子组件中定义props,可以让父组件的数据传递下来,这就好比子组件告诉父组件:"嘿,老哥,我开 ...

  4. JS组件系列——Bootstrap文件上传组件：bootstrap fileinput

    前言:之前的三篇介绍了下bootstrap table的一些常见用法,发现博主对这种扁平化的风格有点着迷了.前两天做一个excel导入的功能,前端使用原始的input type='file'这种标签, ...

  5. JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案（三）：两个Viewmodel搞定增删改查

    前言:之前博主分享过knockoutJS和BootstrapTable的一些基础用法,都是写基础应用,根本谈不上封装,仅仅是避免了html控件的取值和赋值,远远没有将MVVM的精妙展现出来.最近项目打 ...

  6. JS组件系列——Bootstrap组件福利篇：几款好用的组件推荐（二）

    前言:上篇 JS组件系列——Bootstrap组件福利篇:几款好用的组件推荐 分享了几个项目中比较常用的组件,引起了许多园友的关注.这篇还是继续,因为博主觉得还有几个非常简单.实用的组件,实在不愿自己 ...

  7. Vue.js 快速入门

    什么是Vue.js vue是法语中视图的意思,Vue.js是一个轻巧.高性能.可组件化的MVVM库,同时拥有非常容易上手的API.作者是尤雨溪,写下这篇文章时vue.js版本为1.0.7 准备 我推荐 ...

  8. JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案（二）

    前言:上篇 JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案(一) 介绍了下knockout.js的一些基础用法,由于篇幅的关系,所以只能分成两篇,望见谅!昨天就 ...

  9. JS组件系列——Bootstrap寒冬暖身篇：弹出框和提示框效果以及代码展示

    前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你的 ...

随机推荐

  1. ifconfig命令（转）

    许多windows非常熟悉ipconfig命令行工具,它被用来获取网络接口配置信息并对此进行修改.Linux系统拥有一个类似的工具,也就是ifconfig(interfaces config).通常需 ...

  2. PHP加密解密字符串

    项目中有时我们需要使用PHP将特定的信息进行加密,也就是通过加密算法生成一个加密字符串,这个加密后的字符串可以通过解密算法进行解密,便于程序对解密后的信息进行处理. 最常见的应用在用户登录以及一些AP ...

  3. iOS 开发知识小集（1）

    iOS 开发知识小集(1) 2015-05-15  iOS大全 (点击上方蓝字,快速关注我们) 一直想做这样一个小册子,来记录自己平时开发.阅读博客.看书.代码分析和与人交流中遇到的各种问题.之前有过 ...

  4. 利用DBCC PAGE查看SQL Server中的表和索引数据

    16:08 2013-01-06 参考http://doc.chinaunix.net/sqlserver/200810/206034.shtmlDBCC PAGE|IND 参数 DBCC PAGE ...

  5. 安装Cocoapods(Pods 管理iOS 第三方库）

    安装 可先检测Mac电脑是否安装Pods.打开控制台: $ which pod 如果安装,结果如下;如果没有安装,控制台无反应. /usr/bin/pod 如果没有安装, 以下命令安装之. $ sud ...

  6. Java基础之序列化对象——将对象写入到文件中（SerializeObjects）

    控制台程序. 首先定义一个含有任意不同数据类型域的可序列化类: import java.io.Serializable; public class Junk implements Serializab ...

  7. LinkedHashMap 和 LRU算法实现

    个人觉得LinkedHashMap 存在的意义就是为了实现 LRU 算法. public class LinkedHashMap<K,V> extends HashMap<K,V&g ...

  8. 使用Universal USB Installer安装Ubuntu

    1.下载Universal USB Installer 下载地址: 2.下载ubuntu 14 desktop.iso 运行Universal USB Installer,找到电脑上 ubuntu 1 ...

  9. swift语言实战晋级-第9章 游戏实战-跑酷熊猫-7-8 移动平台的算法

    在上个小节,我们完成了平台的产生.那么我们来实现一下让平台移动.平台的移动,我们只需要在平台工厂类中写好移动的方法,然后在GameScene类中统一控制就行了. 在GameScene类中,有个upda ...

  10. Lintcode: O(1) Check Power of 2

    Using O(1) time to check whether an integer n is a power of 2. Example For n=4, return true For n=5, ...