JavaScript terbuka di jendela baru, bukan tab

364

Saya memiliki kotak pilih yang memanggil window.open(url)saat item dipilih. Firefox akan membuka halaman di tab baru secara default. Namun, saya ingin halaman dibuka di jendela baru, bukan tab baru.

Bagaimana saya bisa mencapai ini?

adam
sumber
3
lihat contoh di " jsfiddle.net/HLbLu
Michael Freidgeim
Anda dapat menggunakan github.com/reduardo7/xpopup
Eduardo Cuomo

Jawaban:

456

Berikan jendela 'spesifikasi' parameter dengan lebar / tinggi. Lihat di sini untuk semua opsi yang memungkinkan.

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

Ketika Anda menentukan lebar / tinggi, itu akan membukanya di jendela baru, bukan tab.

DNS
sumber
5
Tip yang bagus. Saya pikir Opera masih akan membuka ini di tab :).
Kevin Tighe
7
Bekerja di IE6, FF 3.6, Chrome 9.0
James Westgate
3
Tidak berfungsi lagi di FF 11.0, lihat pertanyaan saya ! @ James
TMS
14
Tidak berfungsi di peramban hari ini. Secara default mereka semua membuka jendela baru di tab baru dari jendela saat ini. Itu juga tergantung pada opsi browser. Anda tidak dapat mengontrolnya menggunakan JavaScript.
Pavel Hodek
3
Ini BUKAN fakta Anda memasukkan "height = 200, width = 200" yang melakukan pembukaan di jendela baru. Ini hanya fakta untuk menempatkan parameter tambahan (lokasi, status dll ... tidak masalah)
Peter
110

Anda tidak perlu menggunakan tinggi, pastikan Anda menggunakan _blank, Tanpa itu, itu terbuka di tab baru.

Untuk jendela kosong:

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

Untuk URL tertentu:

window.open('http://www.google.com', '_blank', 'toolbar=0,location=0,menubar=0');
nwbrad
sumber
3
Tetapi bagaimana jika saya ingin memberikan nama juga?
Aditi
Paling tidak di Chrome, location=0diperlukan ketika JS dipanggil dari tombol atau elemen anchor.
Ohad Schneider
bekerja dengan sempurna. harus menyertakan lokasi = 0 juga di firefox.
Rick james
@nwbrad apakah Anda yakin tentang bagian '_blank' karena sejauh yang saya tahu '_blank' adalah nilai default ketika kami tidak menentukan nilai lain. Dalam kasus Anda, membuka jendela baru alih-alih tab baru harus melakukan sesuatu dengan menyediakan parameter ke-3 untuk fungsi window.open. Dalam kasus Anda ini adalah 'toolbar = 0, location = 0, menubar = 0'. Anda dapat memverifikasinya dengan menghilangkan parameter ketiga ini dan membiarkan '_blank' di sana sebagai parameter ke-2.
user1451111
Berfungsi dengan sempurna di dalam peramban modern seperti Firefox 76 dan Internet Explorer 11. Kiatnya menambahkan location=0pada parameter. Saya juga menyarankan penamaan jendela daripada menggunakan menggunakan _blanktarget, sehingga jendela yang sama digunakan lagi jika pengguna mengklik beberapa kali elemen yang membuka popup, dan merantai dengan focus()popup yang sudah terbuka mendapat fokus:window.open('http://stackoverflow.com', 'Stack_Overflow','location=0').focus();
OuzoPower
82

Saya mungkin salah, tetapi dari apa yang saya pahami, ini dikendalikan oleh preferensi browser pengguna, dan saya tidak percaya bahwa ini bisa diganti.

Jordan S. Jones
sumber
1
Anda benar, pengguna dapat mengatur "about: config" preferensi "browser.tabs.opentabfor.windowopen" menjadi true, tetapi itu adalah pengaturan global dan saya tidak ingin mengubah perilaku global browser pengguna kami;)
adam
45
Sudah kubilang aku punya kode yang berfungsi. Saya mengetik ini ke konsol pembakar: window.open ("", "poop", "height = 200, width = 200, modal = yes, alwaysRaised = yes"); dan coba tebak ??? berhasil!!!!!!
24
Ya itu berfungsi, tapi ini sepertinya sedikit peretasan. Firefox ditulis sedemikian rupa sehingga membuka jendela vs tab baru adalah preferensi browser, bukan preferensi javascript. Oleh karena itu layak bahwa saran Anda tidak akan berfungsi sama di versi firefox yang lebih baru. Saya lebih suka tidak mengandalkan peretasan.
Adam
2
Dan untuk lebih jelasnya, maksud saya bukan hack javascript. Menambahkan tinggi dan lebar jendela jelas merupakan fitur dari metode js window.open ( w3schools.com/HTMLDOM/met_win_open.asp ) Maksud saya hack dalam arti memanipulasi perilaku firefox yang dimaksud.
Adam
2
Saya tidak akan benar-benar menyebutnya peretasan. Anda hanya berkompromi pada perilaku apa yang sebenarnya ingin Anda miliki, dan menerapkannya.
Matchu
15

Mencoba:

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

Saya memiliki beberapa kode yang melakukan apa yang Anda katakan, tetapi ada banyak parameter di dalamnya. Saya pikir ini adalah minimum, beri tahu saya jika itu tidak berhasil, saya akan memposting sisanya.

arulmr
sumber
Ini berfungsi di FF 31 dan Chrome 36 hanya menggunakan opsi "modal = ya". Semua opsi yang ditentukan juga berfungsi. Saya juga sudah memeriksa "Buka jendela baru di tab baru" di preferensi FF saya. Tanpa opsi terbuka, jendela terbuka di tab baru.
Clint Pachl
Setelah beberapa pengujian lagi, tampaknya hampir semua parameter ― selama setidaknya ada satu ― akan membuka jendela baru alih-alih tab. Misalnya saja "top = 0" bahkan berfungsi di FF 31 dan Chrome 36. Ini ada di OpenBSD menggunakan manajer jendela cwm. Jadi hasilnya bisa bervariasi.
Clint Pachl
Bolehkah saya tahu, apa itu [nama jendela]?
pcs
10

OK, setelah melakukan banyak tes, ini kesimpulan saya:

Ketika Anda melakukan:

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

atau apa pun yang Anda masukkan di bidang tujuan, ini tidak akan mengubah apa pun: halaman baru akan dibuka di tab baru (jadi tergantung pada preferensi pengguna)

Jika Anda ingin halaman dibuka di jendela "nyata" baru, Anda harus memasukkan parameter tambahan. Suka:

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

Setelah pengujian, tampaknya parameter tambahan yang Anda gunakan, jangan 'benar-benar penting: ini bukan fakta Anda meletakkan "parameter ini" atau "ini yang lain" yang menciptakan "jendela nyata" baru tetapi faktanya ada parameter baru (s ).

Tetapi ada sesuatu yang membingungkan dan dapat menjelaskan banyak jawaban yang salah:

Ini:

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

Dan ini:

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

TIDAK akan memberikan hasil yang sama.

Dalam kasus pertama, saat Anda pertama kali membuka halaman tanpa parameter tambahan, itu akan terbuka di tab baru . Dan dalam hal ini, panggilan kedua juga akan dibuka di tab ini karena nama yang Anda berikan.

Dalam kasus kedua, karena panggilan pertama Anda dilakukan dengan parameter tambahan, halaman akan dibuka di " jendela nyata " yang baru. Dan dalam hal ini, bahkan jika panggilan kedua dilakukan tanpa parameter tambahan, itu juga akan dibuka di " jendela nyata " baru ini ... tetapi tab yang sama!

Ini berarti panggilan pertama itu penting karena memutuskan di mana harus meletakkan halaman.

Peter
sumber
Jawaban ini seharusnya memiliki banyak ++++
Mitch VanDuyn
9

Anda seharusnya tidak perlu. Izinkan pengguna untuk memiliki preferensi apa pun yang mereka inginkan.

Firefox melakukan itu secara default karena membuka halaman di jendela baru itu menjengkelkan dan halaman tidak boleh diizinkan untuk melakukannya jika bukan itu yang diinginkan oleh pengguna. (Firefox memang memungkinkan Anda untuk membuka tab di jendela baru jika Anda mengaturnya seperti itu).

CookieOfFortune
sumber
31
kamu sangat salah dan omong-omong, mengatakan "Anda tidak perlu" tidak tepat, terutama jika itu adalah sesuatu yang diinginkan bos
8
Mari kita coba dan simpan komentar yang praktis dan bermanfaat. Kita bisa tidak setuju tanpa menghina.
Adam
17
@theman_on_vista: Meyakinkan atasan Anda adalah tanggung jawab Anda . Perusahaan Anda telah memberi Anda tanggung jawab untuk menyelesaikan masalah desain. Ini termasuk menunjukkan ide-ide desain yang salah.
EFraim
2
Benar sekali. Layar milik pengguna, dan tidak ada orang lain.
Christopher Creutzig
12
Adalah dalam ranah desainer untuk memilih popup atau tab. Meskipun saya adalah pengguna yang selalu lebih suka tab, saya menyadari bahwa kadang-kadang, desain benar-benar memanggil popup atau benar-benar memanggil tab. Itu harus di ranah programmer untuk membuatnya mungkin. Mengesampingkan perbedaan filosofis, komentar semacam ini sepenuhnya tidak pantas untuk situs referensi pemrograman. Dan dalam hal ini, ini bukan "haruskah saya?" pertanyaan. Itu adalah "bagaimana saya?"
jbenet
9

Anda dapat mencoba fungsi berikut:

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

Kode HTML untuk eksekusi:

<a href="#" onclick="open('http://www.google.com')">google search</a>
jgray
sumber
2
Apa tujuan dari popup.location = URL;? The window.open()panggilan harus membukanya ke URL yang tepat, dan dalam contoh kode Anda, URLtidak didefinisikan sehingga akan jatuh kembali ke eksperimental (dan tidak banyak dukungan) objek URL . Sementara menggunakannya untuk itu masih bisa diperdebatkan, saya ingin tahu apa motivasi untuk penggunaannya di sini?
ken
Jawaban yang solid dan mengajari saya cara membuat lokasi tidak dapat diedit. terima kasih
VirtualProdigy
6

Kuncinya adalah parameter:

Jika Anda memberikan Parameter [Tinggi = "", Lebar = ""], maka itu akan terbuka di jendela baru.

Jika Anda TIDAK memberikan Parameter, maka akan terbuka di tab baru.

Diuji di Chrome dan Firefox

Munir
sumber
1
newwin = window.open ('test.aspx', '', ''); diuji di Chrome: 26
MuniR
5

Menariknya, saya menemukan bahwa jika Anda memasukkan string kosong (sebagai lawan dari string nol, atau daftar properti) untuk atribut ketiga window.open, itu akan terbuka di tab baru untuk Chrome, Firefox, dan IE. Jika tidak ada, perilakunya berbeda.

Jadi, ini panggilan baru saya:

 window.open(url, windowName, '');
Tom Lianza
sumber
Bukankah poster asli mencoba membuka popup di jendela baru? Di IE 11, cuplikan kode yang Anda berikan akan membuka jendela atau tab baru berdasarkan preferensi peramban pengguna.
4

coba metode itu .....

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
sumber
3

Bagi saya solusinya adalah memiliki

"location=0"

dalam parameter ke-3. Diuji pada FF / Chrome terbaru dan versi lama IE11

Pemanggilan metode lengkap yang saya gunakan adalah di bawah ini (Karena saya ingin menggunakan lebar variabel):

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
sumber
2

Saya baru saja mencoba ini dengan IE (11) dan Chrome (54.0.2794.1 canary SyzyASan):

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

... dan dibuka di jendela baru.

Yang artinya Clint pachl sudah benar ketika dia mengatakan bahwa memberikan salah satu parameter akan menyebabkan jendela baru terbuka.

- dan ternyata itu tidak harus menjadi parameter yang sah!

(YMMV - seperti yang saya katakan, saya hanya mengujinya di dua tempat ... dan peningkatan selanjutnya mungkin membatalkan hasil, dengan cara apa pun)

ETA: Tapi saya perhatikan - di IE, jendelanya tidak memiliki dekorasi.

theGleep
sumber
1

Dijawab di sini . Tetapi mempostingnya lagi untuk referensi.

window.open()tidak akan terbuka di tab baru jika tidak terjadi pada acara klik yang sebenarnya. Dalam contoh yang diberikan url sedang dibuka pada acara klik yang sebenarnya. Ini akan berhasil asalkan pengguna memiliki pengaturan yang sesuai di browser.

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

Demikian pula, jika Anda mencoba melakukan panggilan ajax dalam fungsi klik dan ingin membuka jendela keberhasilan, pastikan Anda melakukan panggilan ajax dengan async : falseopsi yang disetel.

Venkat Kotra
sumber
1

Saya pikir ini bukan masalah properti target html tetapi Anda menghapus centang "buka nw windows di tab baru sebagai gantinya" opsi di "tab" tab di bawah menu "opsi" firefox. periksa dan coba lagi.

masukkan deskripsi gambar di sini

shihab mm
sumber
0

Saya memiliki pertanyaan yang sama tetapi menemukan solusi yang relatif sederhana.

Dalam JavaScript saya memeriksa untuk window.opener !=null;menentukan apakah jendela itu pop up. Jika Anda menggunakan beberapa kode deteksi serupa untuk menentukan apakah jendela tempat situs Anda dirender adalah pop up, Anda dapat dengan mudah "mematikannya" ketika Anda ingin membuka jendela "baru" menggunakan jendela baru JavaScript.

Cukup letakkan ini di bagian atas halaman Anda, Anda ingin selalu menjadi jendela "baru" .

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

Saya menggunakan ini pada halaman login situs saya sehingga pengguna tidak mendapatkan perilaku pop up jika mereka menggunakan jendela pop up untuk menavigasi ke situs saya.

Anda bahkan dapat membuat halaman pengalihan sederhana yang melakukan ini dan kemudian pindah ke URL yang Anda berikan. Sesuatu seperti,

JavaScript pada halaman induk:

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

Dan kemudian dengan menggunakan sedikit javascript dari sini Anda bisa mendapatkan URL dan mengarahkan ulang ke sana.

JavaScript pada Halaman Redirect:

 <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>
Dan
sumber