父視窗中有三種方式打開子視窗:
1:
window.open(URL,windowName,parameters);
2:
alert(""); //彈出資訊提示對話框
confirm(""); //彈出資訊确認對話框
prompt(""); //具有互動性質的對話框
3:
//建立模态你對話框
window.showModalDialog(sURL,vArguments,sFeatures)
//建立非模态對話框
window.showModelessDialog(sURL,vArguments,sFeatures)
父視窗與子視窗的值傳遞:
在子視窗中通過:window.dialogArguments獲得父視窗中的值,
通過window.returnValue去傳值給父視窗。
//通過子視窗送出父視窗中的表單:form1,送出後執行查詢操作
var parent=window.dialogArguments;
parent.document.form1.action="QueryInfor.jsp";
parent.submit();
在父視窗中:
parasent.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<script type="text/javascript">
function showDialog(){
var obj = new Object();
obj.name="hah";
var a = window.showModalDialog("child.html",window,"");
alert("子視窗的值:"+a);
}
function o(){
alert("nihao");
}
</script>
<BODY>
<input type="text" id="name" /><br/>
<input type="button" οnclick="showDialog()" value="點選">
</BODY>
</HTML>
在子視窗中:
child.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<script type="text/javascript">
function o(){
var v = window.dialogArguments;
alert("值是:"+v.name);
window.returnValue="http://www.i5tt.com";
var name = v.document.getElementById("name").value;
alert(name);
}
</script>
<BODY>
你好啦
<input type="button" οnclick="o()" value="點選">
</BODY>
</HTML>