今天在編寫GIS程式時需要讓網頁對話框彈出後，并不能再點選後面的網頁。起初本想window.open()方法中的參數有能夠設定成所需要的模式（後面将附加在網上搜集的講解window.open()方法中參數用法的說明），但在網絡中尋找和自己嘗試後并沒有發現如此。為此想到了前不久用到的一個封裝的下拉菜單有如此的性質，于是運作了這個下拉菜單的網頁，檢視了源檔案，發現并不是使用的是window.open()方法，而是window.showModalDialog()方法。該網頁的源代碼如下：
onclick="parent.window.showModalDialog('FrmPagePanel.aspx?pageurl='+'FrmNew.aspx','','dialogHeight: 400px; dialogWidth: 600px; edge: Raised; center: Yes; help: No; resizable: No; status: No;scroll:Yes;');;;parent.__doPostBack('ToolBar1','new');parent.__ToolBar_MenuClick();"
下面将有關的window.showModalDialog()方法的參數說明提供如下：
showModalDialog() (IE 4+ 支援)
showModelessDialog() (IE 5+ 支援)
window.showModalDialog()方法用來建立一個顯示HTML内容的模态對話框。
window.showModelessDialog()方法用來建立一個顯示HTML内容的非模态對話框。
使用方法：
vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFeatures])
參數說明：
sURL--必選參數，類型：字元串。用來指定對話框要顯示的文檔的URL。
vArguments--可選參數，類型：變體。用來向對話框傳遞參數。傳遞的參數類型不限，包括數組等。對話框通過window.dialogArguments來取得傳遞進來的參數。
sFeatures--可選參數，類型：字元串。用來描述對話框的外觀等資訊，可以使用以下的一個或幾個，用分号“;”隔開。
1.dialogHeight :對話框高度，不小于１００px，ＩＥ４中dialogHeight 和 dialogWidth 預設的機關是em，而ＩＥ５中是px，為友善其見，在定義modal方式的對話框時，用px做機關。
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。
參數傳遞：
1.要想對話框傳遞參數，是通過vArguments來進行傳遞的。類型不限制，對于字元串類型，最大為4096個字元。也可以傳遞對象，例如：
parent.htm
代碼運作框：
<script>
var obj = new Object();
obj.name="51js";
window.showModalDialog("modal.htm",obj,"dialogWidth=200px;dialogHeight=100px");
</script>
modal.htm
var obj = window.dialogArguments
alert("您傳遞的參數為：" + obj.name)
2.可以通過window.returnValue向打開對話框的視窗傳回資訊，當然也可以是對象。例如：
str =window.showModalDialog("modal.htm",,"dialogWidth=200px;dialogHeight=100px");
alert(str);
window.returnValue="/";
常見問題：
1，如何在模态對話框中進行送出而不新開視窗？
如果你 的 浏覽器是IE5.5+,可以在對話框中使用帶name屬性的iframe，送出時可以制定target為該iframe的name。對于IE4+，你可以用高度為0的frame來作。例如：
test6.htm
window.showModalDialog("test7.htm")
</script> test7.htm
if(window.location.search) alert(window.location.search)
<frameset rows="0,*">
<frame src="about:blank">
<frame src="test8.htm">
</frameset> test8.htm
<form target="_self" method="get">
<input name=txt value="test">
<input type=submit>
</form>
<script>
if(window.location.search) alert(window.location.search)
</script>
答案是不能。但在frame裡是可以的。用這個setcolor=window.showModalDialog("xinqing.htm","", "dialogWidth:320px; dialogHeight:320px;center:1; status:0")打開一個寬320高320的網頁時,其頁面表格最大為:寬314高288就沒有縮放 是以其多餘寬為:6px高為:32px。
3,A頁面通過window.showModalDialog打開一個視窗,在這個視窗添加完資料後 關閉這個視窗 然後重新整理A頁面 請問這個用什麼實作 用window.open很好顯示,用window.showModalDialog就不行了 但我這個必須要用window.showModalDialog.
答案window.showModalDialog( url, window );
然後在彈開視窗中：
window.dialogArguments 即為父視窗window對象的引用。想搞什麼都可以了。
4,想實作的功能如下，比如我有一個頁面a.html在這個頁面内有一個按鈕和一個下拉清單框，當我點選此按鈕時跳出一個頁面為b.html，在b.html這個頁面中我可以填寫一個網站的圖檔位址，當點選确實時這個頁面關閉并且所填入的網站傳值到a.html頁面的下拉清單框内，當我再次點選a.html頁面中的按鈕重複上面的操作時在b.html中所填入的網站位址都能依次傳值到a.html的下拉清單中。
求教各位高手能幫幫小弟，謝謝！
A、B頁面代碼
解決方法
附window.open()方法的參數說明
文法：
oNewDoc = document.open(sUrl [, sName] [, sFeatures] [, bReplace])
說明：
sURL 可選。字元串--指定新的文檔的URL位址。如果沒有指定這一項，那麼将會是一個空的（about:blank）。 sName 可選。字元串--新生成視窗的名字。可以用作form或者a中Target的值。 blank sURL被加載到一個新的未命名的視窗。 _media sURL被加載到一個媒體欄中。（僅适合IE6以及以後版本浏覽器） _parent sURL被加載到目前架構的上層架構上。如果沒有上層架構，則此項的值與_self的值相同。 _search sURL被打開在浏覽器的查找視窗。（僅适合IE5以及以後的浏覽器） _self sURL在目前的視窗上打開，覆寫以前的内容。 _top sURL可能會加載到任何架構支架(Frameset)上，如果沒有定義Frameset，此項值與_self的值相同。 sFeatures 可選。字元串--列出對象表并用逗号分開。每一項都有自己的值，他們将被分開（如："fullscreen=yes, toolbar=yes"）。下面是被支援的各種特性。 channelmode = { yes | no | 1 | 0 } 是否在視窗中顯示階梯模式。預設為no。 directories = { yes | no | 1 | 0 } 是否在視窗中顯示各種按鈕。預設為yes。 fullscreen = { yes | no | 1 | 0 } 是否用全屏方式顯示浏覽器。預設為no。使用這一特性時需要非常小心。因為這一屬性可能會隐藏浏覽器的标題欄和菜單，你必須提供一個按鈕或者其他提示來幫助使用者關閉這一浏覽視窗。ALT+F4可以關閉視窗。一個全屏視窗必須使用階梯(channelmode)模式。 height = number 指定視窗的高度，機關是像素。最小值是100。 left = number 指定視窗距左邊框的距離，機關是像素。值必須大于或者等于0。 location = { yes | no | 1 | 0 } 指定是否在視窗中顯示位址欄。預設為yes。 menubar = { yes | no | 1 | 0 } 指定是否在視窗中顯示菜單欄。預設為yes。 resizable = { yes | no | 1 | 0 } 指定是否在視窗中顯示可供使用者調整大小的句柄。預設為yes。 scrollbars = { yes | no | 1 | 0 } 指定是否在視窗中顯示橫向或者縱向滾動條。預設為yes。 status = { yes | no | 1 | 0 } 指定是否在視窗中顯示狀态欄。預設為yes。 titlebar = { yes | no | 1 | 0 } 指定是否在視窗中顯示标題欄。在非調用HTML Application或者一個對話框的情況下，這一項将被忽略。預設為yes。 toolbar = { yes | no | 1 | 0 } 指定是否在視窗中顯示工具欄，包括如前進、後退、停止等按鈕。預設為yes。 top = number 指定視窗頂部的位置，機關是像素。值必須大于或者等于0。 width = number 指定視窗的寬度，機關是像素。最小值是100。 bReplace 可選。當sURL被加載到同一視窗時，這個布爾型變量指定是否這個sURL建立立一個條目，或者是加到目前該視窗的曆史記錄上。 true sURL覆寫目前文檔的曆史紀錄。 false sURL在曆史記錄中建立一個新的條目。
一、window.open()支援環境：
JavaScript1.0 + / JScript1.0 + / Nav2 + / IE3 + / Opera3+
二、示例：
<SCRIPT>
<!--
window.open ('page.html','newwindow','height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no')
//寫成一行
-->
</SCRIPT>
腳本運作後，page.html将在新窗體newwindow中打開，寬為100，高為400，距屏頂0象素，屏左0象素，無工具條，無菜單條，無滾動條，不可調整大小，無位址欄，無狀态欄。請對照。
上例中涉及的為常用的幾個參數，除此以外還有很多其他參數，請見四。
四、各項參數
其中yes/no也可使用1/0；pixel value為具體的數值，機關象素。
參數 | 取值範圍 | 說明
alwaysLowered | yes/no | 指定視窗隐藏在所有視窗之後
alwaysRaised | yes/no | 指定視窗懸浮在所有視窗之上
depended | yes/no | 是否和父視窗同時關閉
directories | yes/no | Nav2和3的目錄欄是否可見
height | pixel value | 視窗高度
hotkeys | yes/no | 在沒菜單欄的視窗中設安全退出熱鍵
innerHeight | pixel value | 視窗中文檔的像素高度
innerWidth | pixel value | 視窗中文檔的像素寬度
location | yes/no | 位置欄是否可見
menubar | yes/no | 菜單欄是否可見
outerHeight | pixel value | 設定視窗(包括裝飾邊框)的像素高度
outerWidth | pixel value | 設定視窗(包括裝飾邊框)的像素寬度
resizable | yes/no | 視窗大小是否可調整
screenX | pixel value | 視窗距螢幕左邊界的像素長度
screenY | pixel value | 視窗距螢幕上邊界的像素長度
scrollbars | yes/no | 視窗是否可有卷軸框
titlebar | yes/no | 視窗題目欄是否可見
toolbar | yes/no | 視窗工具欄是否可見
width | pixel value | 視窗的像素寬度
z-look | yes/no | 視窗被激活後是否浮在其它視窗之上
=====================================================
【1、最基本的彈出視窗代碼】
其實代碼非常簡單：
<SCRIPT LANGUAGE="javascript">
window.open ('page.html')
</SCRIPT>
因為着是一段javascripts代碼，是以它們應該放在<SCRIPT LANGUAGE="javascript">标簽和</script>之間。<!-- 和 -->是對一些版本低的浏覽器起作用，在這些老浏覽器中不會将标簽中的代碼作為文本顯示出來。要養成這個好習慣啊。
Window.open ('page.html') 用于控制彈出新的視窗page.html，如果page.html不與主視窗在同一路徑下，前面應寫明路徑，絕對路徑(http://)和相對路徑(../)均可。用單引号和雙引号都可以，隻是不要混用。
這一段代碼可以加入HTML的任意位置，<head>和</head>之間可以，<body>間</body>也可以，越前越早執行，尤其是頁面代碼長，又想使頁面早點彈出就盡量往前放。
【2、經過設定後的彈出視窗】
下面再說一說彈出視窗的設定。隻要再往上面的代碼中加一點東西就可以了。
我們來定制這個彈出的視窗的外觀，尺寸大小，彈出的位置以适應該頁面的具體情況。
window.open ('page.html', 'newwindow', 'height=100, width=400, top=0,left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no')
參數解釋：
<SCRIPT LANGUAGE="javascript"> js腳本開始；
window.open 彈出新視窗的指令；
'page.html' 彈出視窗的檔案名；
'newwindow' 彈出視窗的名字（不是檔案名），非必須，可用空''代替；
height=100 視窗高度；
width=400 視窗寬度；
top=0 視窗距離螢幕上方的象素值；
left=0 視窗距離螢幕左側的象素值；
toolbar=no 是否顯示工具欄，yes為顯示；
menubar，scrollbars 表示菜單欄和卷軸框。
Resizable=no 是否允許改變視窗大小，yes為允許；
location=no 是否顯示位址欄，yes為允許；
status=no 是否顯示狀态欄内的資訊（通常是檔案已經打開），yes為允許；
</SCRIPT> js腳本結束
【3、用函數控制彈出視窗】
下面是一個完整的代碼。
<html>
<head>
<script LANGUAGE="JavaScript">
function openwin() { window.open ("page.html", "newwindow", "height=100, width=400, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")
}
//-->
</script>
</head>
<body onload="openwin()">
…任意的頁面内容…
</body>
</html>
這裡定義了一個函數openwin(),函數内容就是打開一個視窗。在調用它之前沒有任何用途。
怎麼調用呢？
方法一：<body onload="openwin()"> 浏覽器讀頁面時彈出視窗；
方法二：<body onunload="openwin()"> 浏覽器離開頁面時彈出視窗；
方法三：用一個連接配接調用：
<a href="#" onclick="openwin()">打開一個視窗</a>
注意：使用的"#"是虛連接配接。
方法四：用一個按鈕調用：
<input type="button" onclick="openwin()" value="打開視窗">
【4、同時彈出2個視窗】
對源代碼稍微改動一下：
function openwin()
{ window.open ("page.html", "newwindow", "height=100, width=100, top=0,left=0,toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")
window.open ("page2.html", "newwindow2", "height=100, width=100, top=100, left=100,toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")
為避免彈出的2個視窗覆寫，用top和left控制一下彈出的位置不要互相覆寫即可。最後用上面說過的四種方法調用即可。
注意：2個視窗的name(newwindows和newwindow2)不要相同，或者幹脆全部為空。OK？
【5、主視窗打開檔案1.htm，同時彈出小視窗page.html】
如下代碼加入主視窗<head>區：
<script language="javascript">
{window.open("page.html","","width=200,height=200")
加入<body>區：
<a href="1.htm" onclick="openwin()">open</a>即可。
【6、彈出的視窗之定時關閉控制】
下面我們再對彈出的視窗進行一些控制，效果就更好了。如果我們再将一小段代碼加入彈出的頁面(注意是加入到page.html的HTML中，可不是首頁面中，否則…)，讓它10秒後自動關閉是不是更酷了？
首先，将如下代碼加入page.html檔案的<head>區：
<script language="JavaScript">
function closeit()
{setTimeout("self.close()",10000) //毫秒}
然後，再用<body onload="closeit()"> 這一句話代替page.html中原有的<BODY>這一句就可以了。(這一句話千萬不要忘記寫啊！這一句的作用是調用關閉視窗的代碼，10秒鐘後就自行關閉該視窗。)
【7、在彈出視窗中加上一個關閉按鈕】
<FORM>
<INPUT TYPE='BUTTON' VALUE='關閉' onClick='window.close()'>
</FORM>
呵呵，現在更加完美了！
【8、内包含的彈出視窗-一個頁面兩個視窗】
上面的例子都包含兩個視窗，一個是主視窗，另一個是彈出的小視窗。
通過下面的例子，你可以在一個頁面内完成上面的效果。
<SCRIPT LANGUAGE="JavaScript">
{OpenWindow=window.open("", "newwin", "height=250, width=250,toolbar=no,scrollbars="+scroll+",menubar=no");
OpenWindow.document.write("<TITLE>例子</TITLE>")
OpenWindow.document.write("<BODY BGCOLOR=#ffffff>")
OpenWindow.document.write("<h1>Hello!</h1>")
OpenWindow.document.write("New window opened!")
OpenWindow.document.write("</BODY>")
OpenWindow.document.write("</HTML>")
OpenWindow.document.close()}
<body>
<a href="#" onclick="openwin()">打開一個視窗</a>
<input type="button" onclick="openwin()" value="打開視窗">
看看 OpenWindow.document.write()裡面的代碼不就是标準的HTML嗎？隻要按照格式寫更多的行即可。千萬注意多一個标簽或少一個标簽就會出現錯誤。記得用OpenWindow.document.close()結束啊。
【9、終極應用--彈出的視窗之Cookie控制】
回想一下，上面的彈出視窗雖然酷，但是有一點小毛病(沉浸在喜悅之中，一定沒有發現吧？)比如你将上面的腳本放在一個需要頻繁經過的頁面裡(例如首頁)，那麼每次重新整理這個頁面，視窗都會彈出一次，是不是非常煩人？:-(有解決的辦法嗎？Yes! ;-) Follow me.
我們使用cookie來控制一下就可以了。
首先，将如下代碼加入首頁面HTML的<HEAD>區：
<script>
{window.open("page.html","","width=200,height=200")}
function get_cookie(Name)
{var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1)
end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset,end))
return returnvalue;
function loadpopup(){
if (get_cookie('popped')==''){
openwin()
document.cookie="popped=yes"
然後，用<body onload="loadpopup()">（注意不是openwin而是loadpop啊！）替換首頁面中原有的<BODY>這一句即可。你可以試着重新整理一下這個頁面或重新進入該頁面，視窗再也不會彈出了。真正的Pop-Only-Once！
寫到這裡彈出視窗的制作和應用技巧基本上算是完成了，需要注意的是，JS腳本中的的大小寫最好前後保持一緻。
本文轉自剛剛部落格園部落格，原文連結：http://www.cnblogs.com/lijigang/archive/2007/01/29/633750.html，如需轉載請自行聯系原作者