日期:2014-05-16  浏览次数:20283 次

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)父窗口与子窗口之间的操作