看了些文章,實現模式窗口有兩種方式。window.showModalDialog以及window.open。
一、方式介紹
window.open()支持環境: JavaScript1.0+/JScript1.0+/Nav2+/IE3+/Opera3+
showModalDialog() (IE 4+ 支持)
showModelessDialog() (IE 5+ 支持)
window.showModalDialog()方法用來創建一個顯示HTML內容的模態對話框。
window.showModelessDialog()方法用來創建一個顯示HTML內容的非模態對話框。
由此可見,showModalDialog是IE的語法,其他瀏覽器並不支持。showModalDialog很好用,但是由於這個原因,有些需要支持多種瀏覽器客戶端的情況就不能使用這個方法。
二、window.open()基本語法:
window.open(pageURL,name,parameters)
其中:
pageURL 為子窗口路徑
name 為子窗口句柄
parameters 為窗口參數(各參數用逗號分隔)
三、實現模式窗口
有文章說parameters 中有一個參數modal=yes(dialog=yes效果一樣),如果設定即為模式窗口。但是經筆者測試,增加這個參數,只是使彈出的窗口的最大化按鈕為不可用,只是和不加該參數的唯一區別。此時,同樣可以操作父窗口。這並不是我想要的模式窗口,我想要的是子窗口彈出后,在子窗口不關閉的情況下是不能操作父窗口的。最后發現很簡單的一句話就可以完成這個功能,在body中加入 onBlur="window.focus();" 即可。
但是這樣還是有問題的,子窗口的任何輸入操作都是不被允許的,只有按鈕可以點擊。
修改一下:
var result= window.open("URL","window","width=600px,height=400px, modal=yes,status=no");
window.onfocus=function (){result.focus();};
window.onclick=function (){result.focus();};
這樣可以在點擊父窗口的時候,將焦點賦予子窗口。
還有一個更好的通用的辦法。
引用:真正能夠解決Dialog問題的方案只有一個,那就是Float Iframe,用Iframe代替Window.open(),用DIV來做遮罩,控制模態。而且,這樣做還有另外一個好處,那就是處理窗口間的關系變得異常容易。用戶也不容易ganjue到自己被打擾了——因為你可以讓Iframe加載完成時再顯示出來,甚至可以加上一些特效,使得Iframe的浮出更加柔和自然。
四、操作父窗口參數
彈出窗口中:
<script>
window.onload=function(){
opener.document.all.obj.value=返回的值
}
</script>