我們知道在BS系統中假如想使用模態對話框,我們就要用window.showModalDialog()這個方法, showModalDialog()方法是用來創建一個顯示Html內容的模態對話框,這篇文檔是用來對使用showModalDialog()產生模態對話框進行各種應用時產生的問題的解決方法,這篇文檔適用于asp,php,jsp等多種web技術,下面sample代碼的我會用jsp。
注:這篇文檔不涉及showModalDialog()方法的說明
需要了解的請參閱 Msdn文檔,和KingErq網友的文檔
http://dev.csdn.net/develop/article/44/44896.shtm
我們先寫一個大家都很熟悉的showModalDialog()最簡單的使用-我們重寫一下javascript中window的alert()方法.
我們先做的事情是新建一個文件alert.jsp
代碼為:
<%@ page contentType="text/html;charset=GBK" language="Java" pageEncoding="GBK" %>
<%
request.setCharacterEncoding("GBK");
String msg=request.getParameter("msg");%>
<html xmlns:wsc>
<head>
<title>#您的系統名稱#----------------------------</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script language=Javascript>
function findenter()
{
if (event.keyCode==13)
window.close();
}
</script>
</head>
<body onkeydown=javascript:findenter();>
<center>
<div style="overflow:auto;height:60px" align="center">
<%=msg%>
</div>
<input type=Button value="確定" onclick="javascript:window.close();">
</center>
</body>
</html>
然后在你BS系統的unit.js文件中添加下面一個方法
function alert(msg)
{
var w=250;
var h=150;
posLeft=(screen.width-w)/2
posTop=(screen.height-h)/2
showModalDialog("alert.jsp?msg=" + msg,"","status:no;dialogHeight: " + h +"px; dialogWidth: " + w +"px;status:no;scroll:no;dialogTop: " + posTop + "px; dialogLeft: " + posLeft + "px'");
}
這時候在引用了unit.js的頁面中用 alert()方法時,出現的模式對話框就是我們自己定義的alert.jsp對話框了.用這種方法,我們可以在我們的系統中用showModalDialog方法把 window.alert(), window.confirm(),window.PRompt() 等ie的默認的提示框都重寫一邊,這樣系統的ui風格就得到了統一,更加美觀.
用showModalDialog模擬alert是他最簡單的應用,而大部分的BS系統中我們使用模態對話框的目的是有一個清單頁面list.jsp,我們要雙擊list.jsp頁面的一條記錄時 彈出edit.jsp這個模態對話框,對這條記錄進行編輯,這時候問題來了,在模態對話框的文件是不能重新載入的,就是說假如我們在edit.jsp文件里把<form>的數據post到save.jsp的時候,save.jsp不會在模態對話框里出現,而是彈出一個新的IE窗口,這顯然是不能忍受的.這個問題的解決方法是這樣的:
我們建立一個中間頁面 比如openWindow.jsp
我們想在模態對話框中打開edit.jsp的時候調用
showModalDialog打開openWindow.jsp頁面,并把edit.jsp的文件名通過get方法傳遞給openWindow.jsp.
新聞熱點
疑難解答