使用 window 對象的 open() 方法可以打開一個新窗口山卦。用法如下:
window.open (URL, name, features, replace)
參數(shù)列表如下:
- URL:可選字符串鞋邑,聲明在新窗口中顯示網(wǎng)頁文檔的 URL账蓉。如果省略枚碗,或者為空,則新窗口就不會顯示任何文檔铸本。
- name:可選字符串,聲明新窗口的名稱箱玷。這個名稱可以用作標(biāo)記 <a> 和 <form> 的 target 目標(biāo)值。如果該參數(shù)指定了一個已經(jīng)存在的窗口壳坪,那么 open() 方法就不再創(chuàng)建一個新窗口,而只是返回對指定窗口的引用媚赖,在這種情況下珠插,features 參數(shù)將被忽略捻撑。
- features:可選字符串磨隘,聲明了新窗口要顯示的標(biāo)準(zhǔn)瀏覽器的特征,具體說明如下表所示顾患。如果省略該參數(shù)番捂,新窗口將具有所有標(biāo)準(zhǔn)特征。
- replace:可選的布爾值江解。規(guī)定了裝載到窗口的 URL 是在窗口的瀏覽歷史中創(chuàng)建一個新條目设预,還是替換瀏覽歷史中的當(dāng)前條目。
該方法返回值為新創(chuàng)建的 window 對象犁河,使用它可以引用新創(chuàng)建的窗口鳖枕。
<caption>新窗口顯示特征</caption>
特征 | 說明 |
---|---|
fullscreen = yes | no | 1 | 0 | 是否使用全屏模式顯示瀏覽器。默認(rèn)是 no桨螺。處于全屏模式的窗口同時處于劇院模式 |
height = pixels | 窗口文檔顯示區(qū)的高度宾符。單位為像素。 |
left = pixels | 窗口的 x 坐標(biāo)灭翔。單位為像素魏烫。 |
location = yes | no | 1 | 0 | 是否顯示地址字段。默認(rèn)是 yes肝箱。 |
menubar = yes | no | 1 | 0 | 是否顯示菜單欄哄褒。默認(rèn)是 yes。 |
resizable = yes | no | 1 | 0 | 窗口是否可調(diào)節(jié)尺寸煌张。默認(rèn)是 yes读处。 |
scrollbars = yes | no | 1 | 0 | 是否顯示滾動條。默認(rèn)是 yes唱矛。 |
status = yes | no | 1 | 0 | 是否添加狀態(tài)欄罚舱。默認(rèn)是 yes井辜。 |
toolbar = yes | no | 1 | 0 | 是否顯示瀏覽器的工具欄。默認(rèn)是 yes管闷。 |
top = pixels | 窗口的 y 坐標(biāo) |
width = pixels | 窗口的文檔顯示區(qū)的寬度粥脚。單位為元素。 |
新創(chuàng)建的 window 對象擁有一個 opener 屬性包个,引用打開它的原始對象刷允。opener 只在彈出窗口的最外層 window 對象(top)中定義,而且指向調(diào)用 window.open() 方法的窗口或框架碧囊。
示例1
下面示例演示了打開的窗口與原窗口之間的關(guān)系树灶。
var win = window.open(); //打開新的空白窗口
win.document.write ("<h1>這是新打開的窗口</h1>"); //在新窗口中輸出提示信息
win.focus (); //讓原窗口獲取焦點
win.opener.document.write ("<h1>這是原來窗口</h1>"); //在原窗口中輸出提示信息
console.log(win.opener == window); //檢測window.opener屬性值
使用 window 的 close() 方法可以關(guān)閉一個窗口。例如糯而,關(guān)閉一個新創(chuàng)建的 win 窗口可以使用下面的方法實現(xiàn)天通。
win.close;
如果在打開窗口內(nèi)部關(guān)閉自身窗口,則應(yīng)該使用下面的方法熄驼。
window.close;
使用 window.closed 屬性可以檢測當(dāng)前窗口是否關(guān)閉像寒,如果關(guān)閉則返回 true,否則返回 false瓜贾。
示例2
下面示例演示如何自動彈出一個窗口诺祸,然后設(shè)置半秒鐘之后自動關(guān)閉該窗口,同時允許用戶單擊頁面超鏈接祭芦,更換彈出窗口內(nèi)顯示的網(wǎng)頁 URL筷笨。
var url = "c.biancheng.net"; //要打開的網(wǎng)頁地址
var features = "height=500, width=800, top=100, left=100, toolbar=no, menubar=no,
scrollbars = no, resizable = no, location = no, status = no"; //設(shè)置新窗口的特性
//動態(tài)生成一個超鏈接
document.write('<a href="c.biancheng.net" target="newW">切換到C語言中文網(wǎng)首頁</a>');
var me = window.open(url, "newW", featrues); //打開新窗口
setTimeout(function () { //定時器
if (me.closed) {
console.log("創(chuàng)建的窗口已經(jīng)關(guān)閉。");
} else {
me.close();
}
}, 5000); //半秒鐘之后關(guān)閉該窗口
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>打開新窗口</title>
<script type="text/javascript" >
function OpenMyWinN(surl,w,h){
window.open(surl, "popUpMyWinN", "scrollbars=yes,resizable=yes,statebar=no,width="+w+",height="+h+",left=200, top=100");
}
</script>
</head>
<body>
<table width="98%" border="0" cellpadding="1" cellspacing="1" align="center" class="tbtitle" style="background:#cfcfcf;">
<tr>
<td height="28" colspan="11" bgcolor="#EDF9D5" background='images/tbg.gif'>
<table width="98%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="30%" style="padding-left:10px;"><strong>訂單列表:</strong> </td>
<td width="45%" align="right" style="padding-top:4px">
<input type="button" name="ss13" value="未付款" sonClick="javascript:OpenMyWinN('#',680,450);" class='np coolbg'/>
</td>
</tr>
</table>
</td>
</tr>
</table>
<a href="javascript:OpenMyWinN('shops_operations_cart.php?oid=S-P1586654454RN545',680,450);" >[詳情]</a>