showModalDialog模态对话框 的使用及一般问题的解决
1,使用
showModalDialog(sURL [, oArguments] [,sFeatures])
参数 :
sURL :  必选参数,类型:字符串。用来指定对话框要显示的文档的URL。
oArguments : 可选参数 , Object类型,用来向对话框传递参数
sFeatures:可选参数,类型:字符串。用来描述对话框的外观等信息,多个属性用 ; 符号分隔

1.   dialogHeight:   对话框高度,不小于100px
2.   dialogWidth:   对话框宽度。
3.   dialogLeft:    离屏幕左的距离。
4.   dialogTop:    离屏幕上的距离。
5.   center:         { yes | no | 1 | 0 } :             是否居中,默认yes,但仍可以指定高度和宽度。
6.   help:            {yes | no | 1 | 0 }:               是否显示帮助按钮,默认yes。
7.   resizable:      {yes | no | 1 | 0 } [IE5+]:    是否可被改变大小。默认no。
8.   status:         {yes | no | 1 | 0 } [IE5+]:     是否显示状态栏。默认为yes[ Modeless]或no[Modal]。
9.   scroll:           { yes | no | 1 | 0 | on | off }:是否显示滚动条。默认为yes。
下面几个属性是用在HTA中的,在一般的网页中一般不使用。
10.   dialogHide:{ yes | no | 1 | 0 | on | off }:在打印或者打印预览时对话框是否隐藏。默认为no。
11.   edge:{ sunken | raised }:指明对话框的边框样式。默认为raised。
12.   unadorned:{ yes | no | 1 | 0 | on | off }:默认为no。

例:

Parent.html var obj = { Paramter : "Paramter" };var returnValue = window.showModalDialog("modal.html",obj,"dialogWidth=200px;dialogHeight=100px");alert(returnValue); // 显示 "Return Data"modal.html//获取传递的参数var obj = window.dialogArguments;alert(obj.Paramter); //显示 "Paramter"window.returnValue = "Return Data";

2,使用过程中出现的问题
1)页面中点击触发表单提交,会新建标签
该问题出现在IE中
解决方法:
在head标签中 加 <base target="_self"/>  为页面上的所有链接或表达提交地址 规定默认目标 
,此处定义为自身,表中页面中所有连接默认在本页打开
2)页面刷新或跳转后 ,无法获取returnValue
该问题出现在谷歌浏览器中
解决方法:
利用window.opener 获取 使用模态对话框的页面的window对象

例:

//modal.html:
if (window.opener) {window.opener.modalReturnValue = list;
}
window.returnValue = list;//Parent.html
var var_Value = showModalDialog("modal.html");
if (var_Value == undefined)var_Value = window.modalReturnValue;

3)js代码 location.href="Url"  或 后台代码 例如 C#: Response.Redirect("Url")  ,控制跳转页面时 ,会新建页打开
该问题出现在IE中
解决方法:
统一交给前台Js控制跳转 代码如下
window.name="targetSelf";  //定义页面句柄
window.open("Url",window.name); //通过指定页面句柄,控制Url在本页面打开
使用此方法后 window.opener 会变为当前页面的window 对象,
对于需要使用 window.opener的代码逻辑会受到影响(例如 问题2 的解决方案 需要用到 window.opener)
完美解决办法
添加 <a id="aBackLink" href="/"></a> 标签,
js代码
document.getElementbyId("aBackLink").click();
此时 页面会跳转,并且不会影响window.opener 对象

4)firefox 浏览器 不支持 showModalDialog方法
解决方法:
利用window.open 替代 showModalDialog方法

例:

//Parent.html
if(window.showModalDialog){var ResultValue = window.showModalDialog("modal.html");alert(ResultValue);
}else{window.AsynDialogFunc = function(p_Value){alert(p_Value);}window.open("modal.html");
}//modal.html
window.returnValue = "returnValue";
if(window.opener){window.opener.AsynDialogFunc(window.returnValue);
}

转载于:https://www.cnblogs.com/wycm/p/5338909.html

showModalDialog模态对话框 的使用及一般问题的解决相关推荐

  1. showModalDialog模态对话框的使用以及浏览器兼容

    ModalDialog 是什么? showModalDialog 是js window对象的一个方法, 和window.open一样都是打开一个新的页面. 区别是: showModalDialog打开 ...

  2. showModalDialog模态对话框的使用详解以及浏览器兼容

    showModalDialog是jswindow对象的一个方法,和window.open一样都是打开一个新的页面.区别是:showModalDialog打开子窗口后,父窗口就不能获取焦点了(也就是无法 ...

  3. Java中modal dialog,showModalDialog模态对话框的使用详解以及浏览器兼容

    1.ModalDialog是什么?showModalDialog是jswindow对象的一个方法,和window.open一样都是打开一个新的页面. 区别是:showModalDialog打开子窗口后 ...

  4. window.showModalDialog模态对话框 值回传 TreeView无刷新

    要求: 点击父页面的text,弹出子页面,将在子页面TreeView选择的值传回,其中子页面树选中叶子节点应有颜色变化(显示选中),且页面不刷新. 实现: 使用window.showModalDial ...

  5. 驼峰命名法模态对话框

    模态对话框 window.showModalDialog("url","向目标对话框传的值","窗口特征参数") 打开模态对话框 模态对话框 ...

  6. 使用javascript打开模态对话框

    1. 标准的方法 <script type="text/javascript">   function openWin(src, width, height, show ...

  7. 转:模态对话框的支持 (IE,Firefox,Chrome)

    原文:模态对话框的支持 (IE,Firefox,Chrome) Opera 和 Chrome 对模态对话框(showModalDialog)的支持有缺陷,且非 IE 浏览器均不支持非模态对话框(sho ...

  8. 关于 IE 模态对话框的两个问题

    showModalDialog 打开的模态对话框有不少经典的缺陷,在这里不再冗述,我只谈谈最近碰到的几个问题以及解决办法. 问题1. showModalDialog 打开一个 aspx 页面时,如果该 ...

  9. JavaScrip高级应用:操作模态与非模态对话框

    JavaScrip高级应用:操作模态与非模态对话框  本文出自:http://www.computerworld.com.cn 作者: 甘冀平 (2002-01-29 20:41:38)  我们知道, ...

最新文章

  1. 通过公历年计算天干地支
  2. python版本越高越好吗-5个Python特性 越早知道越好的
  3. 选择排序—简单选择排序(Simple Selection Sort)
  4. String.format()方法的使用
  5. 「浏览器插件」网址小尾巴终结者
  6. [Ext JS6]包-Package
  7. 【Linux】Linux进阶指令
  8. 从零开始学Koa2(一)
  9. JavaScript高级编程II
  10. 初次汇编程序 masm5
  11. win10 cannot open clipboard 解决办法
  12. marshmallow——快速入门
  13. 6 errors and 0 warnings potentially fixable with the `--fix` option.
  14. 用于高频接收器和发射器的锁相环(PLL)——第二部分 与PLL相关的两个关键技术规格
  15. 购物车中选择物品结算功能的实现
  16. 1413. 逐步求和得到正数的最小值
  17. 把遇到过的对.Net线程的一些问题和误解集中起来和大家分享,也希望大家能一起补充,热烈欢迎讨论(转)...
  18. 在idea中完成创建maven工程,搭建MVC框架并完成和servlet相似的操作
  19. Jenkins使用入门笔记
  20. Python实现NBA文字直播间

热门文章

  1. 万圣节头像小程序源码
  2. iDowns-v1.8.3 无缝对接erphpdown会员中心+在线充值+VIP开通+卡密插件
  3. Let导航网系统源码系统+一键收录
  4. sleek大气后台UI管理系统模板
  5. 设计模式之美:Strategy(策略) -未经作者同意的转载
  6. Note: HTML5 识别语音相关的一些资源
  7. Aptana3 SVN Client安装
  8. 事务(注解声明式事务管理)
  9. 并查集——最小连接路径和Kruskal(hdu1301)
  10. ubuntu 14.04 环境下打开xls、pdf与png文件