วิธีการ open() ของ Window

คำอธิบายและการใช้งาน

open() วิธีการ open() ของ Window จะเปิดหน้าต่างเบราเซอร์หรือแท็บใหม่ ขึ้นอยู่กับการตั้งค่าเบราเซอร์ของคุณและตัวเลือกของคุณ

ดูเพิ่มเติมที่:

วิธีการ close()

ตัวอย่าง

ตัวอย่าง 1

เปิด "www.codew3c.com" ในแท็บเบราเซอร์ใหม่:

window.open("https://www.codew3c.com");

ลองทดสอบเอง

หน้าด้านล่างมีตัวอย่างเพิ่มเติม

รูปแบบ

window.open(url, name, features, replace)

ตัวแปร

ตัวแปร คำอธิบาย
url

ตัวเลือกได้: URL ของหน้าที่ต้องการเปิด

ถ้าไม่ได้กำหนด urlจะเปิดหน้าต่างหรือแท็บว่างใหม่
name ตัวเลือกได้: 属性 target หรือชื่อของหน้าต่าง
features ตัวเลือกได้: รายการสินค้าที่แยกด้วย comma โดยไม่มีช่องว่าง
replace

ถูกทำให้เป็นรายการที่ไม่ได้ใช้งาน

กำหนดว่า URL จะสร้างบันทึกใหม่หรือแทนที่เอกสารปัจจุบันในบันทึกประวัติ

สนับสนุนตัวเลือกต่อไปนี้:

  • true - แทนที่เอกสารปัจจุบันในบันทึกประวัติ URL
  • false - สร้างบันทึกใหม่ในบันทึกประวัติ

คำเตือน：Chrome ในการใช้ replace จะทิ้งข้อผิดพลาดเมื่อมีการกำหนดตัวแปร

ตัวเลือกในตัวแปร name สนับสนุนตัวเลือกต่อไปนี้:

ค่า คำอธิบาย
_blank URL จะโหลดเข้าไปในหน้าต่างหรือแท็บใหม่ โดยเริ่มต้น
_parent URL จะโหลดเข้าไปในเฟรมโฟรมพ่อ
_self URL แทนหน้าปัจจุบัน
_top URL แทนตัวแปลงที่อาจจะโหลดเข้ามาใน frame set
name ชื่อหน้าต่าง (ไม่ระบุหัวข้อหน้าต่าง)

parameter features สนับสนุนค่าต่อไปนี้

ค่า คำอธิบาย
fullscreen=yes|no|1|0 แสดงเบราเซอร์ในโหมดเต็มจอ โดยมาตราฐานคือไม่ โหมดเต็มจอของหน้าต่างต้องอยู่ในโหมดภาพยนตร์
height=pixels ความสูงของหน้าต่าง ด้วย pixel ค่าต่ำสุดคือ 100
left=pixels ตำแหน่งด้านซ้ายของหน้าต่าง (X ตัวเลข) ด้วย pixel ไม่ยอมรับค่าลบ
location=yes|no|1|0 เห็นช่องที่แสดงที่อยู่ URL สำหรับ Opera
menubar=yes|no|1|0 เห็นแถวเมนู
resizable=yes|no|1|0 หน้าต่างสามารถปรับขนาดได้ สำหรับ IE
scrollbars=yes|no|1|0 เห็นโครงเลื่อน สำหรับ IE และ Firefox และ Opera
status=yes|no|1|0 เพิ่มสตาตัสบาร์
titlebar=yes|no|1|0 เห็นหัวเข็มขัด หากโปรแกรมที่เรียกคือโปรแกรม HTML หรือโปรแกรมดาวน์โหลดที่เชื่อถือได้ จะถูกละเลย
toolbar=yes|no|1|0 เห็นเครื่องมือเบราเซอร์ สำหรับ IE และ Firefox
top=pixels ตำแหน่งด้านบนของหน้าต่าง (Y ตัวเลข) ด้วย pixel ไม่ยอมรับค่าลบ
width=pixels ความกว้างของหน้าต่าง ด้วย pixel ค่าต่ำสุดคือ 100

ค่าที่กลับค่า

ค่าที่กลับค่า อ้างอิงถึงหน้าต่าง ถ้าทำงานล้มเหลว ก็จะกลับค่า null

รายละเอียดเทคนิค

คำอธิบาย

open() method จะหาหน้าต่างที่มีอยู่แล้วหรือเปิดหน้าต่างเบราเซอร์ใหม่ ถ้าทำงานล้มเหลว ก็จะกลับค่า null name ถ้า parameter ตั้งค่าหน้าต่างที่มีอยู่แล้ว ก็จะกลับค่าอ้างอิงที่หน้าต่างนั้น หน้าต่างที่กลับค่านี้จะแสดง url ตั้งค่าของเอกสารที่ parameter ตั้งค่า features parameter

ถ้าไม่ได้ระบุ name parameter หรือหน้าต่างที่ระบุไม่มีอยู่ แล้ว open() method จะสร้างหน้าต่างเบราเซอร์ใหม่ หน้าต่างใหม่นี้จะแสดง url URL ที่ parameter ตั้งค่า name ของ parameter features ตั้งค่า url ถ้าเป็น string ว่าง open() เปิดหน้าต่างใหม่

name ตั้งชื่อให้กับหน้าต่างใหม่ ชื่อนี้สามารถมีตัวเลข ตัวอักษรหรือ underline เท่านั้น ชื่อนี้สามารถใช้เป็นตัวที่แสดง <a> และ <form> ค่าของ property target มาใช้เพื่อบังคับให้เอกสารแสดงในหน้าต่างที่ระบุ

ใช้วิธี Window.open() เมื่อนำเอาเอกสารใหม่เข้ามาที่หน้าต่างที่เรียกของเรา สามารถส่งผ่าน replace 参数，用来声明新文档是在窗口的浏览历史中拥有自己的条目，还是替换当前文档的条目。如果 replace 的值为 true，新文档就会替换旧文档。如果值为 false，或者省略，那么新文档会在窗口的浏览历史中拥有自己的条目。这个参数提供的功能与 Location.replace() 方法 ฟังก์ชันที่มีให้

ไม่ควรผิดพลาด Window.open() Document.open() Document.open() มีลักษณะคล้ายคลึงกับให้ระบุความหมายของรหัสของคุณเพื่อที่จะแน่ใจว่ามันชัดแจ้ง Window.open()Document.open() open()บนมาตราฐาน มักจะอ่านฟังก์ชัน open() Document.open()ฉันระบุ Window.open()。

คุณสมบัติหน้าต่าง

features ค่าเป็นรายการคุณสมบัติที่หน้าต่างต้องแสดง ที่ซึ่งคุณสมบัติทุกตัวแบ่งไปด้วยเครื่องหมายเชิงหยุดคำ features กำหนดคุณสมบัติบางอย่าง คุณสมบัติที่ไม่ปรากฏในรายการนี้จะไม่แสดงในหน้าต่าง

feature[=value]

สำหรับคุณสมบัติส่วนใหญ่value ค่าของพวกเขาคือ yes หรือ no หลังจากคุณสมบัติเหล่านี้ มีการปรากฏ value ค่าสามารถละเลยได้ ถ้ามีการปรากฏคุณสมบัตินี้ จะเปิดใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใ� value ค่าคือ yes หากไม่มีการปรากฏ จะเปิดใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใจใ� value ค่าคือ no อย่างไรก็ตาม ควรระบุค่า width หรือ height value ค่าควรหลังจากนั้น คุณจะต้องระบุค่าของพวกเขาในหน่วยเซนติเมตร。

สนับสนุนบราวเซอร์

ทุกบราวเซอร์ทุกครั้งสนับสนุน open()：

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน

รายละเอียดเพิ่มเติม

ตัวอย่าง 2

เปิดเว็บเพจ about:blank ในหน้าต่าง/แท็บใหม่:

var myWindow = window.open("", "", "width=200,height=100");

ลองทดสอบเอง

ตัวอย่าง 3

เปิดหน้าต่างใหม่ที่มีชื่อ "MsgWindow" และเขียนข้อความบนนั้น:

var myWindow = window.open("", "MsgWindow", "width=200,height=100");
myWindow.document.write("<p>This is 'MsgWindow'. I am 200px wide and 100px tall!</p>");

ลองทดสอบเอง

ตัวอย่าง 4

ใช้หน้าต่างใหม่ทดแทนหน้าต่างปัจจุบัน：

var myWindow = window.open("", "_self");
myWindow.document.write("<p>ฉันได้แทนที่หน้าต่างปัจจุบัน</p>");

ลองทดสอบเอง

ตัวอย่าง 5

เปิดหน้าต่างใหม่และควบคุมรูปแบบของมัน

window.open("https://www.codew3c.com", "_blank", "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=400,height=400");

ลองทดสอบเอง

ตัวอย่าง 6

เปิดหลายแท็บ

window.open("http://www.google.com/");
window.open("https://www.codew3c.com/");

ลองทดสอบเอง

ตัวอย่าง 7

เปิดหน้าต่างใหม่ แล้วใช้ฟังก์ชัน close() ปิดหน้าต่างนี้

function openWin() {
  myWindow = window.open("", "myWindow", "width=200,height=100");   // เปิดหน้าต่างใหม่
}
function closeWin() {
  myWindow.close();   // ปิดหน้าต่างใหม่นี้
}

ลองทดสอบเอง

ตัวอย่าง 8

เปิดหน้าต่างใหม่。ใช้ค่าตัวแปร name ที่ส่งกลับชื่อหน้าต่างใหม่

var myWindow = window.open("", "MsgWindow", "width=200,height=100");
myWindow.document.write("<p>ชื่อหน้าต่างนี้คือ: " + myWindow.name + "</p>");

ลองทดสอบเอง

ตัวอย่าง 9

ใช้ค่าตัวแปร opener ที่ส่งกลับอ้างอิงถึงหน้าต่างที่สร้างหน้าต่างใหม่

var myWindow = window.open("", "myWindow", "width=200,height=100");   // เปิดหน้าต่างใหม่
myWindow.document.write("<p>นี่คือ 'myWindow'</p>");   // ข้อความในหน้าต่างใหม่
myWindow.opener.document.write("<p>นี่คือหน้าต่างที่เปิดแบบแนวหลัง!</p>");  // ข้อความที่สร้างหน้าต่างใหม่

ลองทดสอบเอง