Buka URL di tab baru (dan bukan jendela baru)

2102

Saya mencoba membuka URL di tab baru, bukan jendela sembulan.

Saya telah melihat pertanyaan terkait di mana responsnya akan terlihat seperti:

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

Tapi tidak ada yang bekerja untuk saya, browser masih mencoba membuka jendela sembulan.

javascript 
— Menandai
sumber
85
Ini biasanya masalah preferensi. Beberapa orang menyukai windows (dan sangat melindungi perilaku ini), beberapa tab (dan sangat melindungi perilaku ini). Jadi, Anda akan mengalahkan perilaku yang umumnya dianggap sebagai masalah selera, bukan desain.
— Jared Farrish
42
Javascript tidak tahu apa-apa tentang peramban dan tab vs windows, jadi tergantung pada peramban untuk memutuskan cara membuka jendela baru.
— Andrey
3
Bagaimana saya bisa mengonfigurasi Chrome untuk menampilkannya di tab baru, sebagai lawan dari sembulan?
— Tandai
8
Gmail melakukan hal ini, setidaknya di Chrome. Shift + klik pada baris email dan Anda membuka email itu di jendela baru. Ctrl + klik dan Anda membukanya di tab baru. Satu-satunya masalah: menggali kode gmail yang dikaburkan adalah PITA
— Sergio
48
@Sergio, itulah perilaku browser default untuk semua tautan. (Setidaknya untuk Chrome dan Firefox.) Tidak ada hubungannya dengan Gmail.
— Qtax

Jawaban:

929

Tidak ada yang dapat dilakukan oleh penulis yang dapat memilih untuk membuka di tab baru alih-alih jendela baru; ini adalah preferensi pengguna . (Perhatikan bahwa preferensi pengguna default di sebagian besar browser adalah untuk tab baru, jadi tes sepele pada browser di mana preferensi itu belum diubah tidak akan menunjukkan ini.)

CSS3 mengusulkan target-baru , tetapi spesifikasinya diabaikan .

The sebaliknya tidak benar; dengan menentukan dimensi untuk jendela di argumen ketiga window.open(), Anda dapat memicu jendela baru saat preferensi untuk tab.

— Quentin
sumber
42
@AliHaideri Javascript tidak ada hubungannya dengan bagaimana tab / jendela baru dibuka. Itu semua ditentukan oleh pengaturan browser Anda. Menggunakan window.openmemberitahu browser untuk membuka sesuatu yang baru, maka browser membuka apa yang dipilih dalam pengaturannya - tab atau jendela. Di browser yang Anda uji dengan, ubah pengaturan untuk membuka di jendela baru, bukan tab dan Anda akan melihat solusi yang lain salah.
— Ian
239
Dua hal yang menghabiskan waktu orang lain lebih dari memberi tahu mereka bahwa sesuatu tidak dapat dilakukan. (1) Memberi tahu mereka sesuatu yang tidak bisa dilakukan bisa dilakukan. (2) Tetap diam dan membiarkan mereka terus mencari cara untuk melakukan sesuatu yang tidak dapat dilakukan.
— Quentin
8
@Cupcake - Dokumentasi biasanya tidak repot untuk menggambarkan fitur yang tidak ada. evernote.com/shard/s3/sh/428d2d68-39f9-491d-8352-8a9c217b67d7/…
— Quentin
9
@Neel - Karena ini secara ringkas sampai pada topik yang ingin diketahui banyak orang.
— Quentin
4
Penulis dapat melakukan banyak hal (kebanyakan menulis kode yang berbeda). Tidak satu pun dari hal-hal itu yang akan memicu tab, bukan jendela.
— Quentin
1734

Ini sebuah trik, 

function openInNewTab(url) {
  var win = window.open(url, '_blank');
  win.focus();
}

Dalam kebanyakan kasus, ini harus terjadi secara langsung di onclickhandler untuk tautan untuk mencegah pemblokir pop-up, dan perilaku "jendela baru" default. Anda bisa melakukannya dengan cara ini, atau dengan menambahkan pendengar acara ke DOMobjek Anda . 

<div onclick="openInNewTab('www.test.com');">Something To Click On</div>

http://www.tutsplanet.com/open-url-new-tab-using-javascript/

— Rinto George
sumber
117
Tidak bekerja. Mendapat pesan di sebelah kanan bilah alamat: Popup diblokir . Lalu saya mengizinkan popup. Dan voila, itu terbuka di sembulan, bukan tab ! Chrome 22.0.1229.94 pada OS X Lion.
— nalply
39
@ b1naryatr0phy Itu karena Anda tidak benar-benar mengujinya dengan benar. Ubah pengaturan di browser Anda. Apakah dibuka di tab atau jendela ditentukan oleh pengaturan browser Anda. Tidak ada yang dapat Anda lakukan dengan memanggil window.open (atau Javascript apa pun) untuk memilih cara membuka jendela / tab baru.
— Ian
Pertanyaan: Saya menetapkan url tanpa protokol (misalnya my.site.com/Controller/Index). Akibatnya saya mendapatkan jendela baru (tab) oleh url seperti url halaman saat ini (dari mana saya menggunakan fungsi OpenInNewTab) ditambah diteruskan ke url fungsi. Dengan jendela protokol dibuka oleh tautan yang benar. Mengapa?
— user2167382
2
var win = window.open (url, '_blank'); '_blank' tidak diperlukan, untuk window.open () , parameter kedua adalah strWindowName, untuk: Nama string untuk jendela baru. Nama dapat digunakan sebagai target tautan dan formulir menggunakan atribut target dari elemen <a> atau <form>. Nama tidak boleh mengandung karakter spasi putih apa pun. Perhatikan bahwa strWindowName tidak menentukan judul jendela baru.
— hydRAnger
Apakah ada cara untuk membuat ini membuka tab baru tanpa menjadi iframe kotak pasir? Ketika saya menggunakan ini saya mendapatkan kesalahan CORS karena nilai document.domain tidak berubah karena dibuka sebagai iframe.
— Id van der Zee
380

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 berfungsi 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 ditetapkan.

— Venkat Kotra
sumber
28
Akan menyenangkan untuk menandai yang ini sebagai jawaban yang BENAR. Pengujian saya dengan Chrome v26 (Windows) mengonfirmasi bahwa jika kode berada dalam handler klik tombol, ia akan membuka tab baru dan jika kode tersebut dipanggil secara program, misalnya dari konsol, maka ia akan membuka jendela baru.
— CyberFonic
2
@Ian Dari pengujian saya di browser dengan pengaturan default, jawaban ini berfungsi jika jawaban di atas tidak. Jawaban yang diterima yang mengatakan "tidak ada yang bisa Anda lakukan" hanya benar ketika pengguna telah mengubah pengaturan default.
— Garfield
@Ian Demi kejelasan, saya menyebutkan ini dalam jawaban peringatan tentang pengaturan pengguna. "Ini akan berhasil asalkan pengguna memiliki pengaturan yang sesuai di browser." Saya pikir mayoritas pengguna tidak mengubah pengaturan browser dan jawaban ini berfungsi untuk sebagian besar dari mereka.
— Venkat Kotra
async: falsetidak berfungsi di Chrome. Untuk membuka jendela baru dari callback, Anda harus terlebih dahulu membuka jendela kosong sebelum mengirim permintaan HTTP dan kemudian memperbaruinya. Ini hack yang bagus .
— attacomsian
250

window.open Tidak Dapat Diandalkan Buka Popup di Tab Baru di Semua Peramban

Browser yang berbeda menerapkan perilaku window.open dengan cara yang berbeda, terutama yang berkaitan dengan preferensi browser pengguna. Anda tidak dapat mengharapkan perilaku yang sama untuk window.openmenjadi kenyataan di semua Internet Explorer, Firefox, dan Chrome, karena berbagai cara mereka menangani preferensi browser pengguna.

Misalnya, pengguna Internet Explorer (11) dapat memilih untuk membuka munculan di jendela baru atau tab baru, Anda tidak dapat memaksa pengguna Internet Explorer 11 untuk membuka munculan dengan cara tertentu window.open , seperti disinggung dalam jawaban Quentin .

Sedangkan untuk pengguna Firefox (29), menggunakan window.open(url, '_blank') tergantung pada preferensi tab browser mereka, meskipun Anda masih dapat memaksa mereka untuk membuka munculan di jendela baru dengan menentukan lebar dan tinggi (lihat bagian "Bagaimana Tentang Chrome?" Di bawah).

Demonstrasi

Buka pengaturan browser Anda dan konfigurasikan untuk membuka munculan di jendela baru.

Internet Explorer (11)

Dialog pengaturan Internet Explorer 1

Dialog pengaturan tab Internet Explorer

Halaman Uji

Setelah mengatur Internet Explorer (11) untuk membuka munculan di jendela baru seperti yang ditunjukkan di atas, gunakan halaman pengujian berikut untuk menguji window.open:

<!DOCTYPE html>
<html>
  <head>
    <title>Test</title>
  </head>

  <body>
    <button onclick="window.open('https://stackoverflow.com/q/4907843/456814');">
      <code>window.open(url)</code>
    </button>
    <button onclick="window.open('https://stackoverflow.com/q/4907843/456814', '_blank');">
      <code>window.open(url, '_blank')</code>
    </button>
  </body>
</html>

Perhatikan bahwa popup dibuka di jendela baru, bukan tab baru.

Anda juga dapat menguji cuplikan di atas di Firefox (29) dengan preferensi tabnya diatur ke jendela baru, dan melihat hasil yang sama.

Bagaimana dengan Chrome? Ini Menerapkan window.openBerbeda dari Internet Explorer (11) dan Firefox (29).

Saya tidak 100% yakin, tetapi sepertinya Chrome (versi 34.0.1847.131 m) tampaknya tidak memiliki pengaturan apa pun yang dapat digunakan pengguna untuk memilih apakah akan membuka popup di jendela baru atau tab baru (seperti Firefox dan Internet Explorer) memiliki). Saya memeriksa dokumentasi Chrome untuk mengelola pop-up , tetapi tidak menyebutkan apa pun tentang hal semacam itu.

Juga, sekali lagi, browser yang berbeda tampaknya menerapkan perilaku yang window.open berbeda. Di Chrome dan Firefox, menentukan lebar dan tinggi akan memaksa popup, bahkan ketika pengguna telah mengatur Firefox (29) untuk membuka jendela baru di tab baru (seperti yang disebutkan dalam jawaban JavaScript terbuka di jendela baru, bukan tab ) :

<!DOCTYPE html>
<html>
  <head>
    <title>Test</title>
  </head>

  <body>
    <button onclick="window.open('https://stackoverflow.com/q/4907843/456814', 'test', 'width=400, height=400');">
      <code>window.open(url)</code>
    </button>
  </body>
</html>

Namun, potongan kode yang sama di atas akan selalu membuka tab baru di Internet Explorer 11 jika pengguna menetapkan tab sebagai preferensi browser mereka, bahkan tidak menentukan lebar dan tinggi akan memaksa jendela popup baru untuk mereka.

Jadi perilaku window.opendi Chrome tampaknya membuka popup di tab baru saat digunakan dalam suatu onclickacara, membukanya di jendela baru saat digunakan dari konsol browser ( seperti dicatat oleh orang lain ), dan membukanya di jendela baru saat ditentukan dengan lebar dan tinggi.

Ringkasan

Browser yang berbeda menerapkan perilaku window.open berbeda sehubungan dengan preferensi browser pengguna. Anda tidak dapat mengharapkan perilaku yang sama untuk window.openmenjadi kenyataan di semua Internet Explorer, Firefox, dan Chrome, karena berbagai cara mereka menangani preferensi browser pengguna.

Bacaan Tambahan

— Peter Mortensen
sumber
12
Anda tidak menjawab pertanyaan, Anda baru saja membuktikan bahwa window.open tidak konsisten.
— BentOnCoding
223

Satu liner:

Object.assign(document.createElement('a'), { target: '_blank', href: 'URL_HERE'}).click();

Itu menciptakan aelemen virtual , memberikannya target="_blank"sehingga terbuka di tab baru, memberinya yang tepat url hrefdan kemudian mengkliknya.

Dan jika Anda mau, berdasarkan itu Anda dapat membuat beberapa fungsi:

function openInNewTab(href) {
  Object.assign(document.createElement('a'), {
    target: '_blank',
    href,
  }).click();
}

dan kemudian Anda bisa menggunakannya seperti:

openInNewTab("https://google.com");

Catatan penting:

openInNewTab(dan juga solusi lain pada halaman ini) harus dipanggil selama panggilan balik aksi pengguna - mis. acara klik di dalam (tidak perlu dalam fungsi panggilan balik secara langsung, tetapi selama aksi klik).

Jika Anda akan memanggilnya secara manual dalam beberapa saat acak (mis. Di dalam interval atau setelah respons server) - itu mungkin diblokir oleh browser (yang masuk akal karena itu akan menjadi risiko keamanan dan mungkin menyebabkan pengalaman pengguna yang sangat buruk) )

— pie6k
sumber
8
Terima kasih. Pure-JS Anda memiliki bagian yang hilang - seperti yang ditulis Luke Alderton (lihat di bawah), Anda harus melampirkan elemen yang dibuat ke badan dokumen, dalam kode Anda itu tergantung di kekosongan dan setidaknya di Firefox 37 tidak ada apa-apa .
— greenoldman
4
@ mcginniwa Tindakan apa pun seperti ini - jika tidak dipicu oleh tindakan pengguna seperti klik mouse akan mengaktifkan pemblokir popup. Bayangkan Anda bisa membuka url apa saja dengan Javascript tanpa tindakan pengguna - itu akan sangat berbahaya. Jika Anda memasukkan kode ini ke dalam acara seperti fungsi klik - itu akan berfungsi dengan baik - itu sama dengan semua solusi yang diusulkan di sini.
— pie6k
4
Anda dapat menyederhanakan kode Anda sebagai berikut: $('<a />',{'href': url, 'target', '_blank'}).get(0).click();
— shaedrich
5
@shaedrich terinspirasi oleh potongan Anda, saya menambahkan non-jquery one-liner:Object.assign(document.createElement('a'), { target: '_blank', href: 'URL_HERE'}).click();
— pie6k
Itu tidak bekerja di FF!
— Nolesh
91

Jika Anda menggunakannya window.open(url, '_blank'), itu akan diblokir (pemblokir popup) di Chrome.

Coba ini:

//With JQuery

$('#myButton').click(function () {
    var redirectWindow = window.open('http://google.com', '_blank');
    redirectWindow.location;
});

Dengan JavaScript murni,

document.querySelector('#myButton').onclick = function() {
    var redirectWindow = window.open('http://google.com', '_blank');
    redirectWindow.location;
};
— Mohammed Safeer
sumber
Tetapi dalam pertanyaan ini, mereka tidak menyebutkan tentang pembuat situs. Hanya ingin membuka url di jendela baru atau tab baru. Ini tergantung pada browser. Kita tidak perlu repot dengan penulis. Silakan periksa biola itu. Ini berfungsi
— Mohammed Safeer
Ditemukan bahwa, itu tidak berfungsi pada js fiddle dan plunker, tetapi berfungsi ketika Anda membuat file html. Itu karena js biola, output ditampilkan pada iframe, jadi jendela baru diblokir karenathe request was made in a sandboxed frame whose 'allow-popups' permission is not set
— Mohammed Safeer
67

Untuk menguraikan jawaban Steven Spielberg, saya melakukan ini dalam kasus seperti ini:

$('a').click(function() {
  $(this).attr('target', '_blank');
});

Dengan cara ini, tepat sebelum browser akan mengikuti tautan saya mengatur atribut target, sehingga itu akan membuat tautan terbuka di tab atau jendela baru ( tergantung pada pengaturan pengguna ).

Satu contoh baris di jQuery:

$('a').attr('target', '_blank').get(0).click();
// The `.get(0)` must be there to return the actual DOM element.
// Doing `.click()` on the jQuery object for it did not work.

Ini juga dapat dicapai hanya dengan menggunakan DOM API peramban asli juga:

document.querySelector('a').setAttribute('target', '_blank');
document.querySelector('a').click();
— arikfr
sumber
58

Saya menggunakan yang berikut ini dan bekerja dengan sangat baik!

window.open(url, '_blank').focus();
— Ezequiel García
sumber
2
Ini mungkin terbuka di tab atau jendela baru tergantung pada pengaturan browser. Pertanyaannya secara khusus tentang membuka di tab baru bahkan jika preferensi untuk jendela baru.
— Quentin
19

Fakta yang menarik adalah bahwa tab baru tidak dapat dibuka jika tindakan tidak dipanggil oleh pengguna (mengklik tombol atau sesuatu) atau jika asinkron, misalnya, ini TIDAK akan terbuka di tab baru:

$.ajax({
    url: "url",
    type: "POST",
    success: function() {
        window.open('url', '_blank');              
    }
});

Tetapi ini mungkin terbuka di tab baru, tergantung pada pengaturan browser:

$.ajax({
    url: "url",
    type: "POST",
    async: false,
    success: function() {
        window.open('url', '_blank');              
    }
});
— karaxuna
sumber
2
Ini diblokir sebagai popup di Firefox 28, Chrome 34b, dan Safari 7.0.2, semua pengaturan stok. :(
— Steve Meisner
1
"tab baru tidak dapat dibuka jika tindakan tidak diminta oleh pengguna (mengklik tombol atau sesuatu) atau jika tidak sinkron" - benar dari Chrome, tetapi tidak berlaku untuk semua browser. Simpan <script>open('http://google.com')</script>ke .htmlfile dan buka di instalasi baru dari versi terbaru Firefox; Anda akan mengamati bahwa Firefox dengan senang hati membuka Google di tab baru (mungkin setelah Anda mengatakannya untuk mengizinkan popup), bukan jendela baru.
— Mark Amery
13

Hanya menghilangkan parameter [strWindowFeatures] akan membuka tab baru, KECUALI pengaturan browser yang ditimpa (pengaturan browser mengalahkan JavaScript).

Jendela baru

var myWin = window.open(strUrl, strWindowName, [strWindowFeatures]);

Tab baru

var myWin = window.open(strUrl, strWindowName);

-- atau --

var myWin = window.open(strUrl);
— MannyC
sumber
11 
(function(a){
document.body.appendChild(a);
a.setAttribute('href', location.href);
a.dispatchEvent((function(e){
    e.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, true, false, false, false, 0, null);
    return e
}(document.createEvent('MouseEvents'))))}(document.createElement('a')))
— spirinvladimir
sumber
11

Anda dapat menggunakan trik dengan form:

$(function () {
    $('#btn').click(function () {
        openNewTab("http://stackoverflow.com")
        return false;
    });
});

function openNewTab(link) {
    var frm = $('<form   method="get" action="' + link + '" target="_blank"></form>')
    $("body").append(frm);
    frm.submit().remove();
}

Demo jsFiddle

— CodeNinja
sumber
4
Jika Anda menggunakan metode ini, pastikan url tidak memiliki params kueri karena akan dilewati dengan mengirimkan formulir. Salah satu solusinya adalah dengan menanamkan elemen input tersembunyi di dalam elemen form yang memiliki nilai namekunci & valuesebagai untuk semua parameter di dalam params kueri. Dan kemudian menyerahkan formulir
— Mudassir Ali
ini dapat dilakukan lebih sederhana dengan atag daripada formulir, dan menggunakan .click()metode jQuery untuk "mengirimkan" itu. periksa jawaban saya
10

Ini tidak ada hubungannya dengan pengaturan browser jika Anda mencoba membuka tab baru dari fungsi kustom.

Di halaman ini, buka konsol JavaScript dan ketik:

document.getElementById("nav-questions").setAttribute("target", "_blank");
document.getElementById("nav-questions").click();

Dan itu akan mencoba membuka sembulan terlepas dari pengaturan Anda, karena 'klik' berasal dari tindakan kustom.

Untuk berperilaku seperti 'klik mouse' yang sebenarnya pada suatu tautan, Anda harus mengikuti saran @ spirinvladimir dan benar - benar membuatnya:

document.getElementById("nav-questions").setAttribute("target", "_blank");
document.getElementById("nav-questions").dispatchEvent((function(e){
  e.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0,
                    false, false, false, false, 0, null);
  return e
}(document.createEvent('MouseEvents'))));

Ini adalah contoh lengkap (jangan mencobanya di jsFiddle atau editor online serupa, karena tidak akan membiarkan Anda mengarahkan ulang ke halaman eksternal dari sana):

<!DOCTYPE html>
<html>
<head>
  <style>
    #firing_div {
      margin-top: 15px;
      width: 250px;
      border: 1px solid blue;
      text-align: center;
    }
  </style>
</head>
<body>
  <a id="my_link" href="http://www.google.com"> Go to Google </a>
  <div id="firing_div"> Click me to trigger custom click </div>
</body>
<script>
  function fire_custom_click() {
    alert("firing click!");
    document.getElementById("my_link").dispatchEvent((function(e){
      e.initMouseEvent("click", true, true, window, /* type, canBubble, cancelable, view */
            0, 0, 0, 0, 0,              /* detail, screenX, screenY, clientX, clientY */
            false, false, false, false, /* ctrlKey, altKey, shiftKey, metaKey */
            0, null);                   /* button, relatedTarget */
      return e
    }(document.createEvent('MouseEvents'))));
  }
  document.getElementById("firing_div").onclick = fire_custom_click;
</script>
</html>
— chipairon
sumber
1
Saya akhirnya pergi ke solusi yang berbeda di mana saya melakukannya w = window.open("placeholder"); $.ajax(...ajax call that returns the url...) success (...w.location = data.url...)sesuai theandystratton.com/2012
— Paul Tomblin
11
@FahadAbidJanjua Sama sekali tidak benar. Itu masih tergantung pada pengaturan browser. Tidak ada spesifikasi HTML atau Javascript yang menyatakan bahwa "tindakan khusus" harus dibuka di sembulan daripada tab. Memang, tidak ada browser di mesin saya saat ini yang menampilkan perilaku ini.
— nmclean
7 
function openTab(url) {
  const link = document.createElement('a');
  link.href = url;
  link.target = '_blank';
  document.body.appendChild(link);
  link.click();
  link.remove();
}
— Andrew Luca
sumber
1
Ini mungkin terbuka di tab atau jendela baru tergantung pada pengaturan browser. Pertanyaannya secara khusus tentang membuka di tab baru bahkan jika preferensi untuk jendela baru.
— Quentin
3

JQuery

$('<a />',{'href': url, 'target': '_blank'}).get(0).click();

JS

Object.assign(document.createElement('a'), { target: '_blank', href: 'URL_HERE'}).click();
— Bryan
sumber
Ini mungkin terbuka di tab atau jendela baru tergantung pada pengaturan browser. Pertanyaannya secara khusus tentang membuka di tab baru bahkan jika preferensi untuk jendela baru.
— Quentin
2

Atau Anda bisa membuat elemen tautan dan mengekliknya ...

var evLink = document.createElement('a');
evLink.href = 'http://' + strUrl;
evLink.target = '_blank';
document.body.appendChild(evLink);
evLink.click();
// Now delete it
evLink.parentNode.removeChild(evLink);

Ini seharusnya tidak diblokir oleh pemblokir popup ... Semoga.

— Luke Alderton
sumber
2

Ada jawaban untuk pertanyaan ini dan itu bukan tidak.

Saya menemukan pekerjaan yang mudah di sekitar:

Langkah 1: Buat tautan yang tidak terlihat:

<a id="yourId" href="yourlink.html" target="_blank" style="display: none;"></a>

Langkah 2: Klik tautan itu secara terprogram:

document.getElementById("yourId").click();

Ini dia! Membuat saya terpesona.

— ALZlper
sumber
Ini mungkin terbuka di tab atau jendela baru tergantung pada pengaturan browser. Pertanyaannya secara khusus tentang membuka di tab baru bahkan jika preferensi untuk jendela baru.
— Quentin
1

masukkan deskripsi gambar di sini

Saya meneliti banyak informasi tentang cara membuka tab baru dan tetap di tab yang sama. Saya telah menemukan satu trik kecil untuk melakukannya. Mari kita asumsikan Anda memiliki url yang perlu Anda buka - newUrl dan lama url - currentUrl , yang harus tetap aktif setelah tab baru dibuka. Kode JS akan terlihat seperti berikut:

// init urls
let newUrl = 'http://example.com';
let currentUrl = window.location.href;
// open window with url of current page, you will be automatically moved 
// by browser to a new opened tab. It will look like your page is reloaded
// and you will stay on same page but with new page opened
window.open(currentUrl , '_blank');
// on your current tab will be opened new url
location.href = newUrl;
— Vaha
sumber
Pertanyaannya adalah tentang membuka tab baru ketika preferensi pengguna adalah membukanya di jendela baru. Itu tidak menanyakan bagaimana membuka URL di tab baru sambil membuka URL lain di tab yang ada pada saat yang sama.
— Quentin
0

Bagaimana menciptakan <a>dengan _blanksebagai targetnilai atribut dan urlsebagaihref , dengan tampilan gaya: disembunyikan dengan elemen anak-anak? Kemudian tambahkan ke DOM dan kemudian picu acara klik pada elemen anak-anak.

MEMPERBARUI

Itu tidak berhasil. Browser mencegah perilaku default. Itu bisa dipicu secara pemrograman, tetapi tidak mengikuti perilaku default.

Periksa dan lihat sendiri: http://jsfiddle.net/4S4ET/

— Pemenang
sumber
-1

Membuka tab baru dari dalam ekstensi Firefox (Mozilla) seperti ini:

gBrowser.selectedTab = gBrowser.addTab("http://example.com");
— Smile4ever
sumber
-1

Cara ini mirip dengan solusi di atas tetapi diimplementasikan secara berbeda

.social_icon -> beberapa kelas dengan CSS 

 <div class="social_icon" id="SOME_ID" data-url="SOME_URL"></div>


 $('.social_icon').click(function(){

        var url = $(this).attr('data-url');
        var win = window.open(url, '_blank');  ///similar to above solution
        win.focus();
   });
— CG_DEV
sumber
-1

Ini mungkin peretasan, tetapi di Firefox jika Anda menentukan parameter ketiga, 'layar penuh = ya', ini akan membuka jendela baru.

Sebagai contoh,

<a href="#" onclick="window.open('MyPDF.pdf', '_blank', 'fullscreen=yes'); return false;">MyPDF</a>

Tampaknya benar-benar mengesampingkan pengaturan browser.

— Kunal
sumber
-1

ini berfungsi untuk saya, cukup cegah acara, tambahkan url ke <a> taglalu picu acara klik itu tag.

Js
$('.myBtn').on('click', function(event) {
        event.preventDefault();
        $(this).attr('href',"http://someurl.com");
        $(this).trigger('click');
});
HTML
<a href="#" class="myBtn" target="_blank">Go</a>
— Carlos Salazar
sumber
Ini mungkin terbuka di tab atau jendela baru tergantung pada pengaturan browser. Pertanyaannya secara khusus tentang membuka di tab baru bahkan jika preferensi untuk jendela baru.
— Quentin
-1

The window.open(url)akan membuka url di browser baru Tab. Di bawah ini alternatif JS untuk itu

let a= document.createElement('a');
a.target= '_blank';
a.href= 'https://support.wwf.org.uk/';
a.click(); // we don't need to remove 'a' from DOM because we not add it

inilah contoh yang berfungsi (snipet stackoverflow tidak memungkinkan untuk membuka tab baru)

— Kamil Kiełczewski
sumber
"Window.open (url) akan membuka url di Tab browser baru" - Ini akan mengikuti preferensi pengguna untuk jendela baru atau tab baru. Itu tidak akan memaksa tab baru ketika preferensi untuk jendela. (Itulah pertanyaannya). Hal yang sama berlaku untuk target = _blank.
— Quentin
Kedua pendekatan yang Anda sarankan telah disebutkan (dan dikritik) berkali-kali dalam 56 jawaban yang tidak terhapuskan pada pertanyaan ini.
— Quentin
-1

Apakah membuka URL di tab baru atau jendela baru, sebenarnya dikendalikan oleh preferensi browser pengguna. Tidak ada cara untuk menimpanya dalam JavaScript.

window.open()berperilaku berbeda tergantung pada bagaimana itu digunakan. Jika itu disebut sebagai hasil langsung dari tindakan pengguna , katakanlah klik tombol, itu akan berfungsi dengan baik dan buka tab baru (atau jendela):

const button = document.querySelector('#openTab');

// add click event listener
button.addEventListener('click', () => {
    // open a new tab
    const tab = window.open('https://attacomsian.com', '_blank');
});

Namun, jika Anda mencoba untuk membuka tab baru dari panggilan balik permintaan AJAX , browser akan memblokirnya karena itu adalah tindakan pengguna langsung.

Untuk mem-bypass pemblokir popup dan membuka tab baru dari panggilan balik, berikut ini sedikit hack :

const button = document.querySelector('#openTab');

// add click event listener
button.addEventListener('click', () => {

    // open an empty window
    const tab = window.open('about:blank');

    // make an API call
    fetch('/api/validate')
        .then(res => res.json())
        .then(json => {

            // TODO: do something with JSON response

            // update the actual URL
            tab.location = 'https://attacomsian.com';
            tab.focus();
        })
        .catch(err => {
            // close the empty window
            tab.close();
        });
});
— attacomsian
sumber
-1

Saya mencoba cara ini dan sepertinya berfungsi dengan baik

window.open('example.com', 'newWin');

Saya telah menemukan banyak contoh kerja di sini:

http://www.gtalbot.org/FirefoxSection/Popup/PopupAndFirefox.html#TestPopupControl

— Artem Shevtsov
sumber
Itu akan terbuka di tab atau jendela baru sesuai preferensi pengguna. Itu tidak akan memaksa tab baru yang menjadi pertanyaannya.
— Quentin
— Quentin
@ Quentin saya melewatkan bagian itu, tetapi ketika saya mencoba menelepon window.open dengan parameter kedua «windowName» sama dengan «_blank» atau tanpa sama sekali, popup atau tab baru belum muncul di Google Chrome terbaru. Ketika saya mengubah nama jendela menjadi «newWin», sebuah tab baru telah terbuka. Aneh karena parameter nama jendela adalah opsional.
— Artem Shevtsov
-4

Saya akan sedikit setuju dengan orang yang menulis (diparafrasakan di sini): "Untuk tautan di halaman web yang ada, browser akan selalu membuka tautan di tab baru jika halaman baru itu merupakan bagian dari situs web yang sama dengan halaman web yang ada. " Bagi saya, setidaknya, "aturan umum" ini berfungsi di Chrome, Firefox, Opera, IE, Safari, SeaMonkey, dan Konqueror.

Bagaimanapun, ada cara yang tidak terlalu rumit untuk mengambil keuntungan dari apa yang disajikan oleh orang lain. Dengan asumsi kita berbicara tentang situs web Anda sendiri ("thissite.com" di bawah), di mana Anda ingin mengontrol apa yang dilakukan browser, maka, di bawah ini, Anda ingin "specialpage.htm" menjadi KOSONG, tidak ada HTML sama sekali di dalamnya ( menghemat waktu pengiriman data dari server!).

 var wnd, URL;  //global variables

 //specifying "_blank" in window.open() is SUPPOSED to keep the new page from replacing the existing page
 wnd = window.open("http://www.thissite.com/specialpage.htm", "_blank"); //get reference to just-opened page
 //if the "general rule" above is true, a new tab should have been opened.
 URL = "http://www.someothersite.com/desiredpage.htm";  //ultimate destination
 setTimeout(gotoURL(),200);  //wait 1/5 of a second; give browser time to create tab/window for empty page


 function gotoURL()
 { wnd.open(URL, "_self");  //replace the blank page, in the tab, with the desired page
   wnd.focus();             //when browser not set to automatically show newly-opened page, this MAY work
 }
— vernonner3voltazim
sumber
-7

Jika Anda hanya ingin membuka tautan eksternal (tautan yang menuju ke situs lain) maka sedikit JavaScript / jQuery ini berfungsi dengan baik:

$(function(){
    var hostname = window.location.hostname.replace('www.', '');
    $('a').each(function(){
        var link_host = $(this).attr('hostname').replace('www.', '');
        if (link_host !== hostname) {
            $(this).attr('target', '_blank');
        }
    });
});
— Michael
sumber
Tanggapan ini tidak cocok untuk pertanyaan ini. TETAPI, ini pikir yang sangat berguna! Terima kasih atas ide Anda!
— Nuri Akman
-9

Browser akan selalu membuka tautan di tab baru jika tautannya berada di domain yang sama (di situs web yang sama). Jika tautan ada di beberapa domain lain, itu akan membukanya di tab / jendela baru, tergantung pada pengaturan browser.

Jadi, menurut ini, kita dapat menggunakan:

<a class="my-link" href="http://www.mywebsite.com" rel="http://www.otherwebsite.com">new tab</a>

Dan tambahkan beberapa kode jQuery:

jQuery(document).ready(function () {
    jQuery(".my-link").on("click",function(){
        var w = window.open('http://www.mywebsite.com','_blank');
        w.focus();
        w.location.href = jQuery(this).attr('rel');
        return false;
    });
});

Jadi, pertama buka jendela baru di situs web yang sama dengan target _blank (itu akan membukanya di tab baru), dan kemudian buka situs web yang Anda inginkan di dalam jendela baru itu.

— loshMiS
sumber
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.