JavaScript เปิดในหน้าต่างใหม่ไม่ใช่แท็บ

364

ฉันมีกล่องเลือกที่โทรwindow.open(url)เมื่อมีการเลือกรายการ Firefox จะเปิดหน้าในแท็บใหม่ตามค่าเริ่มต้น อย่างไรก็ตามฉันต้องการให้หน้าเปิดในหน้าต่างใหม่ไม่ใช่แท็บใหม่

ฉันจะทำสิ่งนี้ได้อย่างไร

javascript firefox

— อาดัม
แหล่งที่มา

3

ดูตัวอย่างได้ที่ " jsfiddle.net/HLbLu

— Michael Freidgeim

1

อาจเป็นไปได้ซ้ำกับการเปิด URL ในแท็บใหม่โดยใช้ JavaScript

คุณสามารถใช้github.com/reduardo7/xpopup

— Eduardo Cuomo

456

ระบุพารามิเตอร์ 'specs' ที่มีความกว้าง / ความสูง ดูที่นี่สำหรับตัวเลือกที่เป็นไปได้ทั้งหมด

window.open(url, windowName, "height=200,width=200");

เมื่อคุณระบุความกว้าง / ความสูงมันจะเปิดในหน้าต่างใหม่แทนแท็บ

— DNS
แหล่งที่มา

5

เคล็ดลับดี ฉันคิดว่า Opera จะยังคงเปิดในแท็บ :)

— เควินทิก

7

ทำงานใน IE6, FF 3.6, Chrome 9.0

— James Westgate

3

ไม่ทำงานใน FF 11.0 อีกต่อไปดูคำถามของฉัน ! @James

— TMS

14

ไม่ทำงานในเบราว์เซอร์ของวันนี้ โดยค่าเริ่มต้นพวกเขาทั้งหมดเปิดหน้าต่างใหม่ในแท็บใหม่ของหน้าต่างปัจจุบัน นอกจากนี้ยังขึ้นอยู่กับตัวเลือกเบราว์เซอร์ คุณไม่สามารถควบคุมได้โดยใช้ JavaScript

— Pavel Hodek

3

นี่ไม่ใช่ความจริงที่คุณใส่ "height = 200, width = 200" ซึ่งเปิดขึ้นในหน้าต่างใหม่ นี่เป็นเพียงความจริงที่จะใส่พารามิเตอร์เพิ่มเติม (สถานที่ตั้งสถานะ ฯลฯ .... มันไม่สำคัญ)

— Peter

110

คุณไม่จำเป็นต้องใช้ความสูงเพียงแค่ให้แน่ใจว่าคุณใช้_blankหากไม่มีมันก็จะเปิดในแท็บใหม่

สำหรับหน้าต่างว่าง:

window.open('', '_blank', 'toolbar=0,location=0,menubar=0');

สำหรับ URL เฉพาะ:

window.open('http://www.google.com', '_blank', 'toolbar=0,location=0,menubar=0');

— nwbrad
แหล่งที่มา

3

แต่ถ้าฉันต้องการตั้งชื่อด้วยล่ะ

— Aditi

อย่างน้อยใน Chrome location=0เป็นสิ่งจำเป็นเมื่อเรียกใช้ JS จากปุ่มหรือองค์ประกอบยึด

— Ohad Schneider

ทำงานได้อย่างสมบูรณ์แบบ ต้องรวมตำแหน่ง = 0 เช่นกันใน Firefox

— Rick james

@nwbrad คุณแน่ใจเกี่ยวกับส่วน '_blank' เพราะเท่าที่ฉันทราบ '_blank' เป็นค่าเริ่มต้นเมื่อเราไม่ได้ระบุค่าอื่น ๆ ในกรณีของคุณการเปิดหน้าต่างใหม่แทนแท็บใหม่จะต้องทำอะไรบางอย่างด้วยการระบุพารามิเตอร์ที่ 3 ให้กับฟังก์ชั่น window.open ในกรณีของคุณคือ 'toolbar = 0, location = 0, menubar = 0' คุณสามารถตรวจสอบได้โดยเว้นพารามิเตอร์ที่สามนี้และปล่อยให้ '_blank' เป็นพารามิเตอร์ที่สอง

— user1451111

ทำงานได้อย่างสมบูรณ์แบบในเบราว์เซอร์สมัยใหม่เช่น Firefox 76 และ Internet Explorer 11 เคล็ดลับคือการเพิ่มlocation=0พารามิเตอร์ ฉันขอแนะนำให้ตั้งชื่อหน้าต่างแทนการใช้การใช้_blankเป้าหมายเพื่อให้มีการใช้หน้าต่างเดิมอีกครั้งหากผู้ใช้คลิกองค์ประกอบที่เปิดป๊อปอัปหลายครั้งและผูกสายfocus()เพื่อให้ป๊อปอัปที่เปิดอยู่ได้รับความสนใจ:window.open('http://stackoverflow.com', 'Stack_Overflow','location=0').focus();

— OuzoPower

82

ฉันอาจจะผิด แต่จากสิ่งที่ฉันเข้าใจนี่ถูกควบคุมโดยการตั้งค่าเบราว์เซอร์ของผู้ใช้และฉันไม่เชื่อว่าสิ่งนี้สามารถถูกแทนที่ได้

— จอร์แดนเอส. โจนส์
แหล่งที่มา

1

คุณถูกต้องผู้ใช้สามารถตั้งค่า "about: config" browser.tabs.opentabfor.windowopen "เป็นจริง แต่นั่นเป็นการตั้งค่าระดับโลกและฉันไม่ต้องการเปลี่ยนพฤติกรรมทั่วโลกของเบราว์เซอร์ผู้ใช้ของเรา;)

— adam

45

ฉันบอกคุณว่าฉันมีรหัสที่ใช้งานได้ ฉันพิมพ์สิ่งนี้ลงในคอนโซล firebug: window.open ("", "poop", "height = 200, width = 200, modal = ใช่, alwaysRaised = yes"); และคาดเดาสิ่งที่ ??? มันได้ผล!!!!!!

24

ใช่มันใช้งานได้ แต่ดูเหมือนว่าจะเป็นบิตของแฮ็ค Firefox เขียนในลักษณะที่เปิดหน้าต่างใหม่แท็บ vs เป็นการตั้งค่าเบราว์เซอร์ไม่ใช่การตั้งค่าจาวาสคริปต์ ดังนั้นจึงเป็นไปได้ว่าคำแนะนำของคุณจะไม่ทำงานเหมือนกันใน Firefox รุ่นใหม่กว่า ฉันไม่ควรไว้ใจแฮ็ค

— ดัม

2

และเพื่อความชัดเจนฉันไม่ได้หมายความว่าเป็นแฮ็คจาวาสคริปต์ การเพิ่มความสูงและความกว้างของหน้าต่างเป็นคุณสมบัติที่ชัดเจนของวิธี js window.open ( w3schools.com/HTMLDOM/met_win_open.asp ) ฉันหมายถึงการแฮ็คในแง่ของการจัดการพฤติกรรมที่ตั้งใจของ Firefox

— ดัม

2

ฉันจะไม่เรียกมันว่าแฮ็คจริงๆ คุณแค่ประนีประนอมกับพฤติกรรมที่คุณต้องการและนำไปใช้แทน

— Matchu

15

ลอง:

window.open("", [window name], "height=XXX,width=XXX,modal=yes,alwaysRaised=yes");

ฉันมีรหัสบางอย่างที่ทำในสิ่งที่คุณพูด แต่มีพารามิเตอร์มากมายในนั้น ฉันคิดว่าสิ่งเหล่านี้เป็นขั้นต่ำเปล่าแจ้งให้เราทราบหากไม่ได้ผลฉันจะโพสต์ส่วนที่เหลือ

— arulmr
แหล่งที่มา

ใช้งานได้ใน FF 31 และ Chrome 36 โดยใช้ตัวเลือก "modal = ใช่" เท่านั้น ตัวเลือกทั้งหมดระบุการทำงานเช่นกัน ฉันยังมี "เปิดหน้าต่างใหม่ในแท็บใหม่แทน" ตรวจสอบในการตั้งค่า FF ของฉัน หากไม่มีตัวเลือกเปิดหน้าต่างจะเปิดในแท็บใหม่

— Clint Pachl

หลังจากการทดสอบเพิ่มเติมดูเหมือนว่าเกือบทุกพารามิเตอร์ there ตราบใดที่มีอย่างน้อยหนึ่ง ― จะเปิดหน้าต่างใหม่แทนแท็บ ตัวอย่างเช่นเพียงแค่ "top = 0" สามารถใช้งานได้ใน FF 31 และ Chrome 36 นี่คือ OpenBSD โดยใช้ตัวจัดการหน้าต่าง cwm ดังนั้นผลลัพธ์อาจแตกต่างกันไป

— Clint Pachl

ฉันขอทราบได้ไหมว่า [ชื่อหน้าต่าง] คืออะไร?

— ชิ้น

10

ตกลงหลังจากทำแบบทดสอบมากมายมาที่นี่บทสรุปของฉัน:

เมื่อคุณแสดง:

     window.open('www.yourdomain.tld','_blank');
     window.open('www.yourdomain.tld','myWindow');

หรือสิ่งที่คุณใส่ในฟิลด์ปลายทางสิ่งนี้จะไม่เปลี่ยนแปลงอะไร: หน้าใหม่จะเปิดในแท็บใหม่ (ดังนั้นขึ้นอยู่กับการตั้งค่าของผู้ใช้)

หากคุณต้องการให้เปิดหน้าในหน้าต่าง "จริง" ใหม่คุณต้องใส่พารามิเตอร์เพิ่มเติม ชอบ:

window.open('www.yourdomain.tld', 'mywindow','location=1,status=1,scrollbars=1, resizable=1, directories=1, toolbar=1, titlebar=1');

หลังจากการทดสอบดูเหมือนว่าพารามิเตอร์พิเศษที่คุณใช้ไม่สำคัญ: นี่ไม่ใช่ความจริงที่คุณใส่ "พารามิเตอร์นี้" หรือ "อีกอันหนึ่ง" ซึ่งสร้าง "หน้าต่างจริง" ใหม่ แต่ความจริงมีพารามิเตอร์ใหม่ )

แต่มีบางอย่างสับสนและอาจอธิบายคำตอบที่ผิดมาก:

นี้:

 win1 = window.open('myurl1', 'ID_WIN');
 win2 = window.open('myurl2', 'ID_WIN', 'location=1,status=1,scrollbars=1');

และนี่:

 win2 = window.open('myurl2', 'ID_WIN', 'location=1,status=1,scrollbars=1');
 win1 = window.open('myurl1', 'ID_WIN');

จะไม่ให้ผลลัพธ์เดียวกัน

ในกรณีแรกเป็นครั้งแรกที่คุณเปิดหน้าโดยไม่ต้องพารามิเตอร์พิเศษก็จะเปิดใหม่แท็บ และในกรณีนี้สายที่สองจะถูกเปิดในแท็บนี้เนื่องจากชื่อที่คุณให้

ในกรณีที่สองเมื่อคุณทำการโทรครั้งแรกด้วยพารามิเตอร์เพิ่มเติมหน้าจะเปิดขึ้นใน " หน้าต่างจริง " ใหม่ และในกรณีนั้นแม้ว่าจะมีการเรียกครั้งที่สองโดยไม่มีพารามิเตอร์พิเศษมันจะถูกเปิดใน " หน้าต่างจริง " ใหม่นี้... แต่เป็นแท็บเดียวกัน!

นี่หมายความว่าการโทรครั้งแรกมีความสำคัญเนื่องจากจะต้องตัดสินใจว่าจะวางหน้าไหน

— จางไป
แหล่งที่มา

คำตอบนี้ควรมี ++++ มากมาย

— Mitch VanDuyn

9

คุณไม่จำเป็นต้องทำ อนุญาตให้ผู้ใช้มีสิ่งที่พวกเขาต้องการ

Firefox ทำเช่นนั้นโดยค่าเริ่มต้นเนื่องจากการเปิดหน้าเว็บในหน้าต่างใหม่นั้นน่ารำคาญและไม่ควรอนุญาตให้ทำเช่นนั้นหากไม่ใช่สิ่งที่ผู้ใช้ต้องการ (Firefox อนุญาตให้คุณเปิดแท็บในหน้าต่างใหม่หากคุณตั้งค่าไว้)

— CookieOfFortune
แหล่งที่มา

31

คุณผิด และโดยวิธีการพูดว่า "คุณไม่ควรจะต้อง" ไม่เหมาะสมโดยเฉพาะอย่างยิ่งถ้ามันเป็นสิ่งที่เจ้านายต้องการ

8

ให้ลองและแสดงความคิดเห็นในทางปฏิบัติและเป็นประโยชน์ เราไม่เห็นด้วยโดยไม่ดูถูก

— ดัม

17

@theman_on_vista: การเชื่อว่าเจ้านายของคุณเป็นความรับผิดชอบของคุณ บริษัท ของคุณมอบความรับผิดชอบให้คุณในการแก้ไขปัญหาการออกแบบ ซึ่งรวมถึงการชี้ให้เห็นแนวคิดการออกแบบที่ผิด

— EFraim

2

จริงอยู่ หน้าจอเป็นของผู้ใช้และไม่มีใครอื่น

— Christopher Creutzig

12

มันอยู่ในขอบเขตของนักออกแบบที่จะเลือกป๊อปอัพหรือแท็บ ในขณะที่ฉันเป็นผู้ใช้ที่ชอบแท็บอยู่ตลอดเวลาฉันจำได้ว่าบางครั้งการออกแบบเรียกป๊อปอัปหรือเรียกแท็บจริงๆ ควรอยู่ในขอบเขตของโปรแกรมเมอร์เพื่อให้เป็นไปได้ การใส่ความแตกต่างทางปรัชญาไว้ความคิดเห็นแบบนี้ไม่เหมาะสมเลยสำหรับเว็บไซต์อ้างอิงการเขียนโปรแกรม และในกรณีนี้มันไม่ใช่ "ฉันควร?" คำถาม. มันคือ "ฉันจะทำอย่างไร"

— jbenet

9

คุณอาจลองใช้ฟังก์ชันต่อไปนี้:

<script type="text/javascript">
function open(url)
{
  var popup = window.open(url, "_blank", "width=200, height=200") ;
  popup.location = URL;
}
</script>

รหัส HTML สำหรับการดำเนินการ:

<a href="#" onclick="open('http://www.google.com')">google search</a>

— jgray
แหล่งที่มา

2

วัตถุประสงค์ของการpopup.location = URL;คืออะไร? window.open()โทรควรเปิดไปยัง URL ที่เหมาะสมและในตัวอย่างรหัสของคุณURLไม่ได้กำหนดไว้เพื่อให้มันเป็นไปถอยกลับไปทดลอง (และไม่สนับสนุนอย่างกว้างขวาง) วัตถุ URL ในขณะที่ใช้มันเพื่อการถกเถียงกันฉันอยากรู้ว่าแรงจูงใจสำหรับการใช้ที่นี่คืออะไร?

— เคน

คำตอบที่มั่นคงและสอนวิธีทำให้ที่ตั้งไม่สามารถแก้ไขได้ ขอบคุณ

— VirtualProdigy

6

กุญแจสำคัญคือพารามิเตอร์:

หากคุณให้ พารามิเตอร์ [Height = "", Width = ""] จากนั้นจะเปิดในหน้าต่างใหม่

หากคุณไม่ได้ให้พารามิเตอร์ไว้มันจะเปิดในแท็บใหม่

ทดสอบใน Chrome และ Firefox

— มูนีร์
แหล่งที่มา

1

newwin = window.open ('test.aspx', '', ''); ทดสอบใน Chrome: 26

— MuniR

5

น่าสนใจฉันพบว่าถ้าคุณส่งสตริงว่าง (ตรงข้ามกับสตริงว่างหรือรายการคุณสมบัติ) สำหรับแอตทริบิวต์ที่สามของ window.open มันจะเปิดในแท็บใหม่สำหรับ Chrome, Firefox และ IE หากขาดไปพฤติกรรมจะแตกต่างกัน

ดังนั้นนี่คือสายใหม่ของฉัน:

 window.open(url, windowName, '');

— Tom Lianza
แหล่งที่มา

โปสเตอร์ต้นฉบับพยายามเปิดป๊อปอัปในหน้าต่างใหม่ไม่ใช่หรือ นอกจากนี้ใน IE 11 ข้อมูลโค้ดที่คุณให้จะเปิดหน้าต่างหรือแท็บใหม่ตามการตั้งค่าเบราว์เซอร์ของผู้ใช้

4

ลองใช้วิธีนั้น .....

function popitup(url) {
       //alert(url);
       newwindow=window.open("http://www.zeeshanakhter.com","_blank","toolbar=yes,scrollbars=yes, resizable=yes, top=500, left=500, width=400, height=400");
       newwindow.moveTo(350,150);
   if (window.focus) 
          {
             newwindow.focus()
          }
   return false;
  }

— Zeeshan Akhter
แหล่งที่มา

3

สำหรับฉันทางออกคือ

"location=0"

ในพารามิเตอร์ที่ 3 ทดสอบ FF / Chrome ล่าสุดและ IE11 เวอร์ชั่นเก่า

วิธีการโทรแบบเต็มฉันใช้อยู่ด้านล่าง (ตามที่ฉันต้องการใช้ความกว้างของตัวแปร):

window.open(url, "window" + id, 'toolbar=0,location=0,scrollbars=1,statusbar=1,menubar=0,resizable=1,width=' + width + ',height=800,left=100,top=50');

— DAustin
แหล่งที่มา

2

ฉันเพิ่งลองกับ IE (11) และ Chrome (54.0.2794.1 canary SyzyASan):

window.open(url, "_blank", "x=y")

... และมันเปิดในหน้าต่างใหม่

ซึ่งหมายความว่าคลินต์ pachlได้ถูกต้องเมื่อเขากล่าวว่าการระบุพารามิเตอร์ใดพารามิเตอร์หนึ่งจะทำให้หน้าต่างใหม่เปิดขึ้น

- และเห็นได้ชัดว่าไม่จำเป็นต้องเป็นพารามิเตอร์ที่ถูกต้องตามกฎหมาย!

(YMMV - ตามที่ฉันบอกว่าฉันทดสอบในสองแห่งเท่านั้น ... และการอัปเกรดครั้งต่อไปอาจทำให้ผลลัพธ์ไม่ถูกต้องไม่ว่าทางใด)

การทางพิเศษแห่งประเทศไทย: ฉันเพิ่งสังเกตเห็น - ใน IE หน้าต่างไม่มีการตกแต่ง

— theGleep
แหล่งที่มา

1

ตอบที่นี่ที่นี่แต่โพสต์ไว้อีกครั้งเพื่อการอ้างอิง

window.open()จะไม่เปิดในแท็บใหม่หากเหตุการณ์นั้นไม่เกิดขึ้นกับการคลิกจริง ในตัวอย่างที่กำหนดให้ url กำลังถูกเปิดในเหตุการณ์การคลิกจริง สิ่งนี้จะทำงานหากผู้ใช้มีการตั้งค่าที่เหมาะสมในเบราว์เซอร์

<a class="link">Link</a>
<script  type="text/javascript">
     $("a.link").on("click",function(){
         window.open('www.yourdomain.com','_blank');
     });
</script>

ในทำนองเดียวกันหากคุณพยายามโทร ajax ภายในฟังก์ชั่นคลิกและต้องการเปิดหน้าต่างสู่ความสำเร็จตรวจสอบให้แน่ใจว่าคุณกำลังโทร ajax ด้วยasync : falseชุดตัวเลือก

— Venkat Kotra
แหล่งที่มา

1

ฉันคิดว่ามันไม่ใช่ปัญหาคุณสมบัติเป้าหมาย HTML แต่คุณไม่ได้เลือก "เปิดหน้าต่าง nw ในแท็บใหม่แทน" ตัวเลือกในแท็บ "แท็บ" ภายใต้เมนู "ตัวเลือก firefox" ตรวจสอบและลองอีกครั้ง

ป้อนคำอธิบายรูปภาพที่นี่

— shihab mm
แหล่งที่มา

0

ฉันมีคำถามเดียวกันนี้ แต่พบวิธีแก้ปัญหาที่ค่อนข้างง่าย

ในจาวาสคริปต์ฉันกำลังตรวจwindow.opener !=null;สอบว่ามีหน้าต่างปรากฏขึ้นหรือไม่ หากคุณใช้รหัสตรวจจับที่คล้ายกันเพื่อกำหนดว่าหน้าต่างที่คุณกำลังแสดงผลอยู่นั้นเป็นป๊อปอัปหรือไม่คุณสามารถ"ปิด"เมื่อคุณต้องการเปิดหน้าต่าง"ใหม่"โดยใช้ JavaScript หน้าต่างใหม่

เพียงใส่ที่ด้านบนของหน้าคุณต้องการเป็นหน้าต่าง"ใหม่"เสมอ

<script type="text/javascript">
    window.opener=null;
</script>

ฉันใช้สิ่งนี้ในหน้าลงชื่อเข้าใช้ในเว็บไซต์ของฉันดังนั้นผู้ใช้จะไม่ได้รับพฤติกรรมป๊อปอัปหากพวกเขาใช้หน้าต่างป๊อปอัปเพื่อนำทางไปยังไซต์ของฉัน

คุณสามารถสร้างหน้าเปลี่ยนเส้นทางแบบง่าย ๆ ที่ทำได้จากนั้นย้ายไปยัง URL ที่คุณให้ไว้ สิ่งที่ต้องการ,

จาวาสคริปต์ในหน้าหลัก:

window.open("MyRedirect.html?URL="+URL, "_blank");

จากนั้นโดยใช้จาวาสคริปต์เล็ก ๆ น้อย ๆ จากที่นี่คุณจะได้รับ URL และเปลี่ยนเส้นทางไปยังมัน

JavaScript บนหน้าการเปลี่ยนเส้นทาง:

 <script type="text/javascript">
        window.opener=null;

    function getSearchParameters() {
          var prmstr = window.location.search.substr(1);
          return prmstr != null && prmstr != "" ? transformToAssocArray(prmstr) : {};
    }

    function transformToAssocArray( prmstr ) {
        var params = {};
        var prmarr = prmstr.split("&");
        for ( var i = 0; i < prmarr.length; i++) {
            var tmparr = prmarr[i].split("=");
            params[tmparr[0]] = tmparr[1];
        }
        return params;
    }

    var params = getSearchParameters();
    window.location = params.URL;
    </script>

— แดน
แหล่งที่มา