使用window.open()打開新頁面,類似於彈出框

window.open()打開一個新的瀏覽器窗口,但是我們常常使用發現直接寫:

window.open(test.html)

這個是頁面直接在瀏覽器打開一個新窗口,類似於這樣的兩個新窗口:兩個頁面是並排的

 

但是我們想要的效果並不是這樣,我們想要以下這個的效果,類似於彈窗框一樣:

 

 

那么我們可以通過這樣的代碼控制window.open()打開的新頁面的大小以及位置,代碼入下:

// 控制寬高以及左右位置
window.open(test.html,"scrollbars=yes,resizable=yes,width=1200,height=900,top=100,left=400")

除此之外,window.open()還可以進行如下配置:

 window.open   彈出新窗口的命令；   
 'test.html'   彈出窗口的文件名；   
 'newwindow'   彈出窗口的名字（不是文件名），非必須，可用空''代替；   
 height=100    窗口高度；   
 width=400     窗口寬度；   
 top=0   　　   窗口距離屏幕上方的象素值；   
 left=0   　　  窗口距離屏幕左側的象素值；   
 toolbar=no    是否顯示工具欄，yes為顯示；   
 menubar，scrollbars   表示菜單欄和滾動欄。   
 resizable=no  是否允許改變窗口大小，yes為允許；   
 location=no   是否顯示地址欄，yes為允許；   
 status=no     是否顯示狀態欄內的信息（通常是文件已經打開），yes為允許；

　當然各個瀏覽器的配置也不一樣:詳情可查看:https://www.runoob.com/jsref/met-win-open.html