showModalDialog以及IE7 对话框样式

简介: window.showModalDialog(URL,dialogArgments.features) 打开一个新窗口 URL为要开启的网页名字。 dialogArgments为设定好传递给新视窗网页的参数,可以为任意数据类型。 feature 与open()的类似,都是格式方面的设定。调用格式为featureName1:featureValue1:(分号)featureName2:featu

window.showModalDialog(URL,dialogArgments.features) 打开一个新窗口

URL为要开启的网页名字。
dialogArgments为设定好传递给新视窗网页的参数,可以为任意数据类型。
feature 与open()的类似,都是格式方面的设定。调用格式为featureName1:featureValue1:(分号)featureName2:featureValue2:

关于feature具体的参数我就不详细写了,看名字就应该知道什么用处了吧。
certer , dialogHeight, dialogLeft,dialogTop,dialogWidth,help(是否显示help按钮,下同),status,resizeable
值=1为yes,0为no.

我认为最重要的是dialogArgments,可以传递值到新的窗口。
第二重要就是 它的返回值 window.returnValue.可以在showModalDialog开启的窗口关闭后前,回传一个任意类型的值。
使用示例:

< script  language ="javascript" >
function show(){
    
var sRet = window.showModalDialog('a.html','title','scrollbars=no;resizable=no;help=no;status=no;dialogTop=25; dialogLeft=0;dialogHeight=350px;dialogwidth=410px;');
        
if(sRet == "refresh"
        
{
            window.location.reload();
        }

        
}

</ script >
< input  name =""  type ="button"  onClick ="show();"  value ="打开"   />

< script  language ="javascript" >
    
function al(){
        alert(
"关闭了哦");
        window.returnValue 
= "refresh";
        window.close();
    }

</ script >
< input  name =""  type ="button"  onClick ="al();"  value ="关闭"   />

下面对IE7中使用该函数的不同进行一下解释。顺便要注意的是,IE7对标签的验证是非常严格的,以前随便写的<base target="_self"/>必须放在

< title >标题 </ title >
< base  target ="_self" />

下面,否则就不会有效。切记切记!好了,下面对窗口的大小问题进行以下解释吧。

 

1、模态窗口自适应:
在Internet Explorer中定义window.open 和 window.showModalDialog以打开一个网页对话框的时候,在不同版本的Windows和不同版本的IE中,窗口的大小和样式都是不同的。
在IE7中更是有了很大的不同,状态栏,主要内容被默认保留(下详),还加了一个只读状态的地址栏.窗口的最小尺寸被限定在了250*150:


如上图所示:在ie7中,定义的高度仅仅是窗体内容高度,状态栏及地址栏的高度都不算在内的;而ie6则包含了状态栏及地址栏的高度。所以,我们需要依据不同的操作系统及ie版本,高度自适应的js代码如下:

/* *
 * 模态窗口高度调整.
 * 根据操作系统及ie不同版本,重新设置窗口高度,避免滚动条出现.
 
*/
function  resetDialogHeight(){
  
if (window.dialogArguments  ==   null ){
    
return // 忽略非模态窗口
  }

  
var  ua  =  navigator.userAgent;
  
var  height  =  document.body.offsetHeight;
  
if (ua.lastIndexOf( " MSIE 6.0 " !=   - 1 ){
  
if (ua.lastIndexOf( " Windows NT 5.1 " !=   - 1 ){
    
// alert("xp.ie6.0");
     var  height  =  document.body.offsetHeight;
    window.dialogHeight
= (height + 102 ) + " px " ;
  }
  
else   if (ua.lastIndexOf( " Windows NT 5.0 " !=   - 1 ){
    
// alert("w2k.ie6.0");
     var  height  =  document.body.offsetHeight;
    window.dialogHeight
= (height + 49 ) + " px " ;
  }
}
}

模态窗口页面加上如下代码:
// 窗口加载后,判断系统及其ie版本调整高度
window.onload  =  resetDialogHeight;


2、ie7中模态窗口提交时新开窗口问题:
IE 7.0 对模态窗口 <base target='_self'> 属性的放置位置更加严格。<base>标签必须放置在<head>标签对中,否则提交表单时总是会新开窗口 。示例如下 :
< html >
< head >
< title >标题 </ title >
< base  target ="_self" />
.. .. ..
</ head >
< body  onload ="pageClose();"  scroll ="no" >
.. .. ..
</ body >
</ html >

 
相关文章
|
2月前
|
安全 Shell
关于双击桌面上的IE图标却显示“打开方式”对话框的解决办法
关于双击桌面上的IE图标却显示“打开方式”对话框的解决办法
|
容器
IE中ocx控件的无模式对话框不接收方向键等键盘消息的问题的解决办法
在ocx控件中如果含有无模式对话框,那么当ocx在ie中显示时,往往接收不到 诸如tab,方向键和退格键。所有这些消息都被IE容器给截取了,对于这个问题,ms给出了解决方法: 首先:   int CMyActiveXCtrl::OnCreate(LPCREATESTRUCT lpCreateStru...
1108 0
|
Web App开发 前端开发 JavaScript
|
2月前
|
Web App开发 JavaScript 前端开发
添加浮动按钮点击滚动到网页底部的纯JavaScript演示代码 IE9、11,Maxthon 1.6.7,Firefox30、31,360极速浏览器7.5.3.308下测试正常
添加浮动按钮点击滚动到网页底部的纯JavaScript演示代码 IE9、11,Maxthon 1.6.7,Firefox30、31,360极速浏览器7.5.3.308下测试正常
|
1月前
|
JavaScript 前端开发
|
5月前
|
Web App开发 XML 开发框架
技术心得记录:在IE浏览器中的奇怪页面表现
技术心得记录:在IE浏览器中的奇怪页面表现
56 0
|
3月前
|
JavaScript
VUE——如何兼容IE9|IE10|IE11浏览器
VUE——如何兼容IE9|IE10|IE11浏览器
143 0
VUE——如何兼容IE9|IE10|IE11浏览器