問題描述:有一個列表,點擊每個標(biāo)題彈出新頁面進入修改該標(biāo)題的具體內(nèi)容。提交以后,子頁面關(guān)閉,父頁面刷新。
經(jīng)常想起來的是使用window.open彈出一個新窗口,然后好像這個不好處理。所以到網(wǎng)上查了一下,使用了window.showModalDialog方法。
ShowModalDialog函數(shù)的功能:
打開一個子窗口,并且可與父窗口相互傳遞數(shù)據(jù),它與window.open的最大區(qū)別就在于由ShowModalDialog打開子窗口后,父窗口將不能操作。
使用方法:
vReturnValue = window.showModalDialog(sURL [, vArguments] [, sFeatures])
參數(shù)說明:
sURL
必選參數(shù),類型:字符串。用來指定對話框要顯示的文檔的URL。
vArguments
可選參數(shù),類型:變體。用來向?qū)υ捒騻鬟f參數(shù)。傳遞的參數(shù)類型不限,包括數(shù)組等。對話框通過window.dialogArguments來取得傳遞進來的參數(shù)。
sFeatures
可選參數(shù),類型:字符串。用來描述對話框的外觀等信息,可以使用以下的一個或幾個,用分號“;”隔開。
dialogHeight 對話框高度,不小于100px,IE4中dialogHeight 和 dialogWidth 默認的單位是em,而IE5中是px,為方便其見,在定義modal方式的對話框時,用px做單位。
dialogWidth: 對話框?qū)挾取?br />
dialogLeft: 距離桌面左的距離。
dialogTop: 離桌面上的距離。
center: {yes | no | 1 | 0 }:窗口是否居中,默認yes,但仍可以指定高度和寬度。
help: {yes | no | 1 | 0 }:是否顯示幫助按鈕,默認yes。
resizable: {yes | no | 1 | 0 } [IE5+]:是否可被改變大小。默認no。
status: {yes | no | 1 | 0 } [IE5+]:是否顯示狀態(tài)欄。默認為yes[ Modeless]或no [Modal]。
scroll:{ yes | no | 1 | 0 | on | off }:指明對話框是否顯示滾動條。默認為yes。
參數(shù)傳遞方法:
父窗口向子窗口傳遞參數(shù)采用ShowModalDialog的第2個參數(shù)即可,父窗口要獲取子窗口傳回的參數(shù)則可通過ShowModalDialog函數(shù)的返回值獲取。
子窗口獲取父窗口參數(shù)的方法為采用子窗口window對象dialogArguments屬性獲取,例如:
var a=window.dialogArguments;
子窗口向父窗口返回參數(shù)采用window.returnValue屬性,如:
window.returnValue=1;
window.close();
比如實現(xiàn)上面問題,只需要這樣:
var url = "page.html";
var retValue = window.showModalDialog(url, "newwindow", "dialogWidth:500px;dialogHeight:200px;help:no;resizable:no;scroll:no;status:no");
if (retValue == "ok")
{
document.location.reload(true);
}
注意這里要在page頁面中提交事件里添加
window.returnValue = "ok";
window.close();
這樣就可以實現(xiàn)上面的功能了!
一、showModalDialog和showModelessDialog有什么不同?
showModalDialog:被打開后就會始終保持輸入焦點。除非對話框被關(guān)閉,否則用戶無法切換到主窗口。類似alert的運行效果。
showModelessDialog:被打開后,用戶可以隨機切換輸入焦點。對主窗口沒有任何影響。
二、怎樣才讓在showModalDialog和showModelessDialog的超連接不彈出新窗口?
在被打開的網(wǎng)頁里加上<base target="_self">就可以了。這句話一般是放在<html>和<body>之間的。
三、怎樣才刷新showModalDialog和showModelessDialog里的內(nèi)容?
在showModalDialog和showModelessDialog里是不能按F5刷新的,又不能彈出菜單。這個只能依靠javascript了,以下是相關(guān)代碼:
<body onkeydown="if (event.keyCode==116){reload.click()}">
<a id="reload" href="filename.htm" style="display:none">reload...</a>
將filename.htm替換成網(wǎng)頁的名字然后將它放到你打開的網(wǎng)頁里,按F5就可以刷新了,注意,這個要配合<base target="_self">使用,不然你按下F5會彈出新窗口的。
四、如何用javascript關(guān)掉showModalDialog(或showModelessDialog)打開的窗口。
<input type="button" value="關(guān)閉" onclick="window.close()">
也要配合<base target="_self">,不然會打開一個新的IE窗口,然后再關(guān)掉的。
posted on 2008-01-21 16:27
周銳 閱讀(611)
評論(0) 編輯 收藏 所屬分類:
HTML 、
JavaScript