1. 标準的方法
<mce:script type="text/javascript"><!--
function openwin(src, width, height, showscroll){
window.showmodaldialog (src,"","location:no;status:no;help:no;dialogwidth:"+width+";dialogheight:"+height+";scroll:"+showscroll+";");
}
// --></mce:script>
例:<span style="cursor: pointer" onclick="openwin
(’http://www.deepteach.com’, ’500px’, ’400px’, ’no’)">點選</span>
2. 要注意的是,firefox并不支援該功能,它支援的文法是
window.open
(’openwin.html’,'newwin’, 'modal=yes, width=200,height=200,resizable=no, scrollbars=no’ );
3. 如何自動判斷浏覽器
<input type="button" value="打開對話框" onclick="showdialog('#')"/>
<script language="javascript">
<!--
function showdialog(url)
{
if( document.all ) //ie
feature="dialogwidth:300px;dialogheight:200px;status:no;help:no";
window.showmodaldialog(url,null,feature);
else
//modelessdialog可以将modal換成dialog=yes
feature ="width=300,height=200,menubar=no,toolbar=no,location=no,";
feature+="scrollbars=no,status=no,modal=yes";
window.open(url,null,feature);
//-->
</script>
4. 如何在頁面之間傳遞數值
(一)showmodaldialog使用例子,父視窗向子視窗傳遞值,子視窗設定父視窗的值,子視窗關閉的時候傳回值到父視窗.
farther.html
<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<title>new document </title>
<meta content="editplus" name="generator">
<meta content="" name="author">
<meta content="" name="keywords">
<meta content="" name="description">
<mce:script language="javascript"><!--
function openchild(){
var k = window.showmodaldialog("child.html",window,"dialogwidth:335px;status:no;dialogheight:300px");
if(k != null)
document.getelementbyid("txt11").value = k;
// --></mce:script>
</head>
<body>
<font face="宋體"></font>
<br>
傳遞到父視窗的值:<input id="txt9" type="text" value="3333333333333" name="txt9"><br>
傳回的值:<input id="txt11" type="text" name="txt11"><br>
子視窗設定的值:<input id="txt10" type="text" name="txt10"><br>
<input id="button1" onclick="openchild()" type="button" value="openchild" name="button1">
</body>
</html>
child.html
--------------
<meta http-equiv="expires" content="0">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="pragma" content="no-cache">
父視窗傳遞來的值:<input id="txt0" type="text" name="txt0"><br>
輸入要設定父視窗的值:<input id="txt1" type="text" name="txt1"><input id="button1" onclick="setfather()" type="button" value="設定父視窗的值" name="button1"><br>
輸入傳回的值:<input id="txt2" type="text" name="txt2"><input id="button2" onclick="retrunvalue()" type="button" value="關閉切傳回值" name="button2">
<input id="button3" onclick="" type="button" value="關閉重新整理父視窗" name="button3">
<script language="javascript">
var k=window.dialogarguments;
//獲得父視窗傳遞來的值
if(k!=null)
{
document.getelementbyid("txt0").value = k.document.getelementbyid("txt9").value;
}
//設定父視窗的值
function setfather()
k.document.getelementbyid("txt10").value = document.getelementbyid("txt1").value
//設定傳回到父視窗的值
function retrunvalue()
var s = document.getelementbyid("txt2").value;
window.returnvalue=s;
window.close();
//-->
</script>
</html>
----------------------------
說明:
由于showmodaldialog緩存嚴重,下面是在子視窗取消用戶端緩存的設定.也可以在伺服器端取消緩存,參考:
http://adandelion.cnblogs.com/articles/252137.html
(二)下面是關閉重新整理父視窗的例子
-----------------------
<meta name="generator" content="editplus">
<meta name="author" content="">
<meta name="keywords" content="">
<meta name="description" content="">
function openchild()
var k = window.showmodaldialog("child.html",window,"dialogwidth:335px;status:no;dialogheight:300px");
if(k == 1)//判斷是否重新整理
alert('重新整理');
window.location.reload();
傳遞到父視窗的值:<input id="txt9" type="text" value="3333333333333" name="txt9"><br>
<input type="button" value="openchild" onclick="openchild()" id="button1" name="button1">
----------------------
<input id="button1" onclick="winclose(1)" type="button" value="關閉重新整理父視窗" name="button1">
<input id="button2" onclick="winclose(0)" type="button" value="關閉不重新整理父視窗" name="button2">
//關閉視窗傳回是否重新整理的參數.
function winclose(isrefrash)
window.returnvalue=isrefrash;