window.showModalDialog与window.open

最新推荐文章于 2025-05-30 10:47:34 发布

风云正

最新推荐文章于 2025-05-30 10:47:34 发布

阅读量154

点赞数

CC 4.0 BY-SA版权

分类专栏： web 文章标签： window.showModalDialog window.open

本文链接：https://blog.youkuaiyun.com/chenzheng8975/article/details/84427813

web 专栏收录该内容

29 篇文章

订阅专栏

本文介绍如何使用JavaScript实现全屏弹出窗口，并通过window.showModalDialog和window.open方法展示具体实现细节。同时，文章还讲解了如何在父级页面获取子级页面的返回值。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

//window.showModalDialog全屏显示

function winModalFullScreen(strURL)
{

var sheight = screen.height-70;

var swidth = screen.width-10;

var winoption ="dialogHeight:"+sheight+"px;dialogWidth:"+ swidth

+"px;status:yes;scroll:yes;resizable:yes;center:yes";

var tmp=window.showModalDialog(strURL,window,winoption);

return tmp;

}

//window.open全屏显示

function winOpenFullScreen(strURL)
{

var sheight = screen.height-70;

var swidth = screen.width-10;

var winoption ="left=0,top=0,height="+sheight+",width="+swidth

+",toolbar=yes,menubar=yes,location=yes,status=yes,scrollbars=yes,resizable=yes";

var tmp=window.open(strURL,'',winoption);

return tmp;

}

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。

window.open方式父级页面获取子级页面的返回值
function check() {
window.opener.document.getElementById("txtId").value=id;
window.opener.document.getElementById("txtName").value=name;
}

这样，父级页面的document.getElementById("txtId") 和

document.getElementById("txtName") 2个控件就可以得到子级页面的返回值。