1. 程式人生 > >window.showModalDialog模式對話方塊 和 window.open的區別

window.showModalDialog模式對話方塊 和 window.open的區別

1.模式對話方塊父視窗 彈出模式對話方塊 程式碼如下

Java程式碼
  1. window.showModalDialog(url,window,    
  2. "help:no;scroll:no;resizable:no;status:0;dialogWidth:420px;dialogHeight:200px;center:yes" );  
window.showModalDialog(url,window, 

"help:no;scroll:no;resizable:no;status:0;dialogWidth:420px;dialogHeight:200px;center:yes" );


1.
引數1 url,url後面可以接"?name=user"引數
引數2 傳遞給子視窗的值 可以是window

對象,陣列 var arry=[],其他變數 型別不限制,對於字串型別,最大為4096個字元。也

可以傳遞物件

引數3 設定子視窗的高度 ,寬度 等元素
dialogHeight :對話方塊高度,不小於100px,IE4中dialogHeight 和 dialogWidth 預設的單位是em,而IE5中是px,為方便

其見,在定義modal方式的對話方塊時,用px做單位。
dialogWidth: 對話方塊寬度。
dialogLeft: 離螢幕左的距離。
dialogTop: 離螢幕上的距離。
center: {yes | no | 1 | 0 }:視窗是否居中,預設yes,但仍可以指定高度和寬度。
help: {yes | no | 1 | 0 }:是否顯示幫助按鈕,預設yes。
resizable: {yes | no | 1 | 0 } [IE5+]:是否可被改變大小。預設no。
status: {yes | no | 1 | 0 } [IE5+]:是否顯示狀態列。預設為yes[ Modeless]或no[Modal]。
scroll:{ yes | no | 1 | 0 | on | off }:指明對話方塊是否顯示滾動條。預設為yes。
下面幾個屬性是用在HTA中的,在一般的網頁中一般不使用。
dialogHide:{ yes | no | 1 | 0 | on | off }:在列印或者列印預覽時對話方塊是否隱藏。預設為no。
edge:{ sunken | raised }:指明對話方塊的邊框樣式。預設為raised。
unadorned:{ yes | no | 1 | 0 | on | off }:預設為no。


2.子父視窗傳值

在子視窗獲取 父視窗的值
var param = window
.dialogArguments  //獲取傳遞的引數

如果是 陣列或字串物件 可以在子視窗進行相應操作,例如把該值賦給子視窗的某個元素等等

如果傳遞的是 父視窗物件 可以通過 param .document.getElementById('checkAllid2'); 獲取父視窗的
html 元素進行相應的操作

3.模式對話方塊提交
模式對話方塊如果有form需要提交,提交時會新開一個瀏覽器,所以模式對話方塊提交時需要提交到
fream框架頁面 在form元素中加上target="mainFrame"

Java程式碼
  1. <form id="myFrom" action="submit.jsp?checkResult=failure"
     method="post" target="mainFrame">   
  2.  </form>  
   <form id="myFrom" action="submit.jsp?checkResult=failure" method="post" target="mainFrame">
    </form>



target="mainFrame" 是主頁面的 中間框架的id

主頁面

Java程式碼
  1. <frameset id="middleframe" rows="95,8,*,30" cols="*"  framespacing="0">   
  2.   <frame src="bannar.jsp" name="topFrame" scrolling="NO" noresize border=0  frameborder=0>   
  3.    <frame src="scollbar.htm" name="ScollbarFrame" scrolling="NO" noresize border=0  frameborder=0 >   
  4.   <frameset id="bodyFrame" rows="*" cols="230,8,*" framespacing="0"  border="0" >   
  5.     <frame src="menu.jsp" name="leftFrame"  scrolling="no" noresize border=0  frameborder=0>   
  6.     <frame src="Scoll.htm" name="ScollFrame" scrolling="NO" noresize border=0  frameborder=0>   
  7.     <frame src="main_tab.jsp" name="mainFrame" id="mainFrame" scrolling="auto"  border=0  frameborder=0><!--    
  8. main/main_tab.html -->   
  9.   </frameset>   
  10.   <frame src="bottom.jsp" scrolling="NO"  name="bottomFrame" id="bar" border=0  frameborder=0>   
  11. </frameset>  
<frameset id="middleframe" rows="95,8,*,30" cols="*"  framespacing="0">
  <frame src="bannar.jsp" name="topFrame" scrolling="NO" noresize border=0  frameborder=0>
   <frame src="scollbar.htm" name="ScollbarFrame" scrolling="NO" noresize border=0  frameborder=0 >
  <frameset id="bodyFrame" rows="*" cols="230,8,*" framespacing="0"  border="0" >
    <frame src="menu.jsp" name="leftFrame"  scrolling="no" noresize border=0  frameborder=0>
	<frame src="Scoll.htm" name="ScollFrame" scrolling="NO" noresize border=0  frameborder=0>
    <frame src="main_tab.jsp" name="mainFrame" id="mainFrame" scrolling="auto"  border=0  frameborder=0><!-- 

main/main_tab.html -->
  </frameset>
  <frame src="bottom.jsp" scrolling="NO"  name="bottomFrame" id="bar" border=0  frameborder=0>
</frameset>



4.可以通window.returnValue向開啟對話方塊的視窗返回資訊,當然也可以是物件。例

Java程式碼
  1. parent.htm    
  2. <script>    
  3. str =window.showModalDialog("modal.htm",,"dialogWidth=200px;dialogHeight=100px");    
  4. alert(str);    
  5. </script>    
  6. modal.htm    
  7. <script>    
  8. window.returnValue="http://www.web3.cn";    
  9. </script>   
parent.htm 
<script> 
str =window.showModalDialog("modal.htm",,"dialogWidth=200px;dialogHeight=100px"); 
alert(str); 
</script> 
modal.htm 
<script> 
window.returnValue="http://www.web3.cn"; 
</script> 


2.window.open
window.open開啟視窗時 可以開啟多個 且焦點不會鎖定在子視窗,仍然能夠操作父視窗。這樣的特點使得某些情況下
我們最好不要用open打去開一個子視窗
父視窗開啟子視窗程式碼

Java程式碼
  1. window.open(url, "","help=no,toolbar=no,height=330,width=515,top=50,left=50,resizable=no,status=no,toolbar=no,menubar=no,directories ,titlebar=no,location=no");  
window.open(url, "","help=no,toolbar=no,height=330,width=515,top=50,left=50,resizable=no,status=no,toolbar=no,menubar=no,directories ,titlebar=no,location=no");


引數1.url,url後面可以接"?name=user"
引數2.彈出視窗的名字(非檔名) 可以為空
引數3.設定子視窗的高度 ,寬度 等屬性

    height=100 視窗高度; 
  width=400 視窗寬度; 
  top=0 視窗距離螢幕上方的象素值; 
  left=0 視窗距離螢幕左側的象素值; 
  toolbar=no 是否顯示工具欄,yes為顯示; 
  menubar,scrollbars 表示選單欄和滾動欄。 
  resizable=no 是否允許改變視窗大小,yes為允許; 
  location=no 是否顯示位址列,yes為允許; 
  status=no 是否顯示狀態列內的資訊(通常是檔案已經開啟),yes為允許;