html中弹出窗口方式总结

1. showModalDialog方法

• 语法：window.showModalDialog(sURL [, vArguments] [, sFeatures])

第一个参数：目标页面的url  必须项

第二个参数：指定供目标页面使用的对象，通常设为window（即当前文档的window对象）可选项

第三个参数：指定目标窗口的装饰  可选项

（这是有模式的，无模式用showModelessDialog方法，用法一样）

• 用法示例

test1.html关键代码

	window.onload = function()
	{
		document.getElementById("choose").onclick = function()
		{
			window.showModalDialog("./test2.html",window,"certer:yes;status:no;help:no;dialogHeight:300px;dialogWidth:400px");
		}
	}

test2.html关键代码

	function setValue(name,psw)
	{
		var superWindow = window.dialogArguments; //取得test1传过来的window对象，即superWindow就是test1的window对象
		superWindow.document.getElementById("username").value = name;//利用test2中的name、psw的值给test1的两个文本框赋值，实现页面数据交互
		superWindow.document.getElementById("password").value = psw;
		window.close();
	}

• 注意：该方法在新版chrome中不支持，慎用

2. window对象的open方法

• 语法：window.open( [sURL] [, sName] [, sFeatures] [, bReplace])

第一个参数：指定目标页面的URL，如果没写，则打开about:blank空白页面   可选项

第二个参数：指定打开的模式，如：新标签页打开

第三个参数：指定目标窗口的装饰

• 用法示例

test1.html关键代码

	window.onload = function()
	{
		document.getElementById("choose").onclick = function()
		{
			window.open("./test2.html","_blank","status=no,toolbar=no,width=400,height=300");
		}
	}

test2.html关键代码

	function setValue(name,psw)
	{
		window.opener.document.getElementById("username").value = name;//window.opener取得就是父窗口的window对象，同方法1的superWindow
		window.opener.document.getElementById("password").value = psw;
		window.opener = null;
		window.close();
	}