JavaScript使用Window對象

使用Window.open方法新建窗口
Window對象表示的是瀏覽器窗口,它有多種操作,其中一個重要的方法是open,表示新建一個窗口來打開指定頁面。例如在a.html中執行以下語句:
window.open("b.html");
則新建一個窗口打開了b.html頁面,這和在a.html頁面中用一條鏈接打開頁面的效果是一樣的:
<a href="b.html" target="_blank">b</html>
但window.open對新建窗口的樣式可以有更多的控制,例如:窗口大小、是否顯示菜單欄、是否顯示滾動條、是否顯示地址欄等等。其完整的調用語法如下:
window.open(url,windowName,"name1=value1[,name2=value2,[…]]");
其中:url是要打開的頁面地址;windowName表示新建窗口的名字,從而可以對其進行控制;最後是一個用字符串表示的參數列表。每一個參數都是名稱和值對應的形式,用逗號隔開,其中可以使用的參數如下。
? height:表示新建窗口的高度;
? width:表示新建窗口的寬度;
? left:表示新建窗口到屏幕左邊緣的距離;
? top:表示新建窗口到屏幕頂端的距離。
以上屬性的單位均爲象素,例如對於800×600的分辨率,left=400則表示新窗口的左邊緣處於屏幕的正中間。其餘的屬性主要是布爾型的,用yes或者1表示開啓,用no或者0表示關閉。如果是開啓,則yes或者1可省略,例如:toolbar=1等價於toolbar=yes等價於toolbar,下面分別介紹這些屬性:
? directories:是否顯示鏈接工具欄;
? location:是否顯示地址欄;
? menubar:是否顯示菜單欄;
? resizable:是否允許調整窗口大小;
? scrollbars:是否顯示滾動條;
? status:是否顯示狀態欄;
? toolbar:是否顯示工具欄。
例如,下面的代碼將顯示一個無菜單、無工具條、無滾動條的窗口:
window.open("test3.html","","height=200,width=300, toolbar=0,menubar=0,scrollbars=0");

 

封裝下就可以在頁面中調用如下:

 

/*
 * 打開新窗口
 * f:鏈接地址
 * n:窗口的名稱
 * w:窗口的寬度
 * h:窗口的高度
 * s:窗口是否有滾動條,1:有滾動條;0:沒有滾動條
 */
function openWin(f,n,w,h,s){
	sb = s == "1" ? "1" : "0";
	l = (screen.width - w)/2;
	t = (screen.height - h)/2;
	sFeatures = "left="+ l +",top="+ t +",height="+ h +",width="+ w
			+ ",center=1,scrollbars=" + sb + ",status=0,directories=0,channelmode=0";
	openwin = window.open(f , n , sFeatures );
	if (!openwin.opener)
		openwin.opener = self;
	openwin.focus();
	return openwin;
}

/*
 * 打開刪除窗口(模式對話框)
 */
function openDeleteDialog(url,confirmString){
	var c = confirmString;
	if(c == null || c == ''){
		c = "你確認要刪除記錄嗎?";
	}
	if(confirm(c)){
		return window.showModalDialog(url,"window123","dialogHeight:234px;dialogWidth:271px;resizable:no;help:yes;status:no;scroll:no");
	}
	return false;
}

 

window.openerwindow.parent的區別

window.opener是當前頁面A通過open方法彈出一個窗口B,那在B頁面上 window.opener就是A

window.parent是當前頁面C通過location.href轉到新的頁面D,那在D頁面上window.parent就是B
子窗口向父窗口傳值
function selectOrg(oid,field){
	window.opener.document.getElementById("orgNameId").value = field.v;
	window.opener.document.getElementById("orgIdId").value = oid;
	window.close();
}
 

 

 

 總結JavaScript(Iframe、window.open、window.showModalDialog)父窗口與子窗口之間的操作

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章