當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

js中的showModalDialog的实战应用

發布時間：2024/8/23 编程问答 33 豆豆

生活随笔收集整理的這篇文章主要介紹了 js中的showModalDialog的实战应用小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

IE提供的showModalDialog()方法是一個很好用的Web應用功能，雖然一般的網站應用不是很常見，但一旦涉及到企業應用級的Web開發則就很有用了?，F在我用一個簡單易懂的例子來說明一下：

這一應用需要兩個web文件：

1、父窗口（也即用來控制彈出窗口的那個頁面）
showModalDialog.html
---------------------------------------------------------------------------------------

<html>
<head>
<title>showModalDialog</title>
<script language="JavaScript">
<!--
//aInfo作為數組對象，將被showModalDialog傳遞出去
//也可用var oMyobject=new Object();
//oMyobject.firstProperty = value; oMyobject.lastProperty = value;的方式定義一個對象（firstProperty,lastProperty是自己按需定義的對象屬性，可是任意取名并賦值）
var aInfo?? = new Array(3);
aInfo[0] = "aaaaaaaaaaa";
aInfo[1] = "bbbbbbbbbbb";
aInfo[2] = "ccccccccccc";
var url = "dialog.html";
var sFeatures ="dialogWidth=500px;dialogHeight=500px;dialogLeft=0;dialogTop=0;";
/*sFeatures的各項可選參數:
*dialogWidth:彈出窗口的寬度；
*dialogHeight:彈出窗口的高度；
*dialogLeft:彈出窗口的左邊距
*dialogTop:
*edge:sunken | raised
*center: yes|no|1|0|on|off
*dialogHide: yes|no|1|0|on|off
*help: yes|no|1|0|on|off
*resizable: yes|no|1|0|on|off
*scroll: yes|no|1|0|on|off
*status: yes|no|1|0|on|off
*unadorned: yes|no|1|0|on|off
*/

functionshowDialog(){
//彈出一個showModalDialog,并以returnValue來獲取返回值
var returnValue = window.showModalDialog(url,aInfo,sFeatures);
if(returnValue!=null){
?? //for(var i=0;i<returnValue.length;i++){
??? //document.all.info.innerHTML =returnValue[i]+"<br>";
?? //}
?? //輸出返回值
?? document.all.info.innerHTML=returnValue;
}
//

}
//-->
</script>
</head>

<body>
<h3><a href="#" οnclick="showDialog()">打開Dialog窗口</a></h3>
<div id="info"></div>
</body>
</html>

2、子窗口（即將被彈出的那個頁面）
dialog.html
-----------------------------------------------------------------------------------------

<html>
<head>
<title>Dialog</title>
</head>

--------------------------------------------------------------------

好了，運行showModalDialog.html即可看出其中的端倪來了。。。

通過這些工作，我實現了將值在父頁面和子頁面中的相互傳遞和處理。我想這也正是ms設計showModalDialog()方法的初衷之所在吧。當然，這個例子太簡單了。但我的目的只是通過它了解showModalDialog的執行機制。實際應用中需要舉一反三才行呢。（完

轉載于:https://www.cnblogs.com/liaoshiyong/archive/2013/06/13/3150881.html

總結

以上是生活随笔為你收集整理的js中的showModalDialog的实战应用的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。