當(dāng)前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

js中的showModalDialog的实战应用

發(fā)布時(shí)間：2024/8/23 编程问答 34 豆豆

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

IE提供的showModalDialog()方法是一個(gè)很好用的Web應(yīng)用功能，雖然一般的網(wǎng)站應(yīng)用不是很常見，但一旦涉及到企業(yè)應(yīng)用級(jí)的Web開發(fā)則就很有用了。現(xiàn)在我用一個(gè)簡(jiǎn)單易懂的例子來說明一下：

這一應(yīng)用需要兩個(gè)web文件：

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

<html>
<head>
<title>showModalDialog</title>
<script language="JavaScript">
<!--
//aInfo作為數(shù)組對(duì)象，將被showModalDialog傳遞出去
//也可用var oMyobject=new Object();
//oMyobject.firstProperty = value; oMyobject.lastProperty = value;的方式定義一個(gè)對(duì)象（firstProperty,lastProperty是自己按需定義的對(duì)象屬性，可是任意取名并賦值）
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的各項(xiàng)可選參數(shù):
*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(){
//彈出一個(gè)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、子窗口（即將被彈出的那個(gè)頁面）
dialog.html
-----------------------------------------------------------------------------------------

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

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

好了，運(yùn)行showModalDialog.html即可看出其中的端倪來了。。。

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

轉(zhuǎn)載于:https://www.cnblogs.com/liaoshiyong/archive/2013/06/13/3150881.html

總結(jié)

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

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。