Soru JavaScript kullanarak yeni bir sekmede (ve yeni bir pencerede değil) bir URL açın


Açmaya çalışıyorum URL açılır pencerenin aksine yeni bir sekmede. Yanıtların aşağıdaki gibi görüneceği ilgili soruları gördüm:

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

Ama hiçbiri benim için işe yaramadı, tarayıcı hala bir açılır pencere açmaya çalıştı.


1594
2018-02-05 15:52


Menşei


Bu genellikle bir tercih meselesidir. Bazı insanlar pencereleri (ve bu davranışı şiddetle koruyor), bazı sekmeleri (ve bu davranışı şiddetle koruyor). Bu yüzden, genel olarak bir zevk meselesi olarak kabul edilen, tasarım değil, bir davranışı yenersiniz. - Jared Farrish
Javascript, tarayıcınız ve sekmelerden pencereler ile ilgili hiçbir şey bilmiyor, bu yüzden yeni bir pencerenin nasıl açılacağına karar vermek gerçekten tarayıcıya bağlı. - Andrey
Bir pop-up'ın tersine, Chrome'u yeni bir sekmede görüntülemek için nasıl yapılandırabilirim? - Mark F
Gmail bunu bir şekilde, en azından Chrome'da yapar. Bir e-posta satırını Shift + tıklayın ve bu e-postayı yeni bir pencerede açarsınız. Ctrl + tıklayın ve yeni bir sekmede açabilirsiniz. Tek sorun: gmail'in gizlenmiş kodunun kazılması bir PITA'dır. - Sergio
@Sergio, bu herhangi bir bağlantı için varsayılan tarayıcı davranışı. (En azından Chrome ve Firefox için.) Gmail ile ilgisi yoktur. - Qtax


Cevaplar:


Bir yazarın yapabileceği hiçbir şey yeni bir pencere yerine yeni bir sekmede açmayı seçemez. Bu bir kullanıcı tercihi.

CSS3 önerdi Hedef-yeni, fakat şartname terk edildi.

ters doğru değil; üçüncü argümanında pencerenin boyutlarını belirterek window.openTercihler sekmeler için olduğunda yeni bir pencere açabilirsiniz.


699
2018-02-05 15:53



@JacksonGariety - Ve bu pencere veya sekme için tarayıcı tercihini nasıl geçersiz kılar? - Quentin
@AliHaideri Javascript'in yeni sekme / pencerenin nasıl açıldığı ile ilgisi yoktur. Her şey tarayıcınızın ayarları tarafından belirlenir. kullanma window.open Tarayıcıya yeni bir şey açmasını söyler, ardından tarayıcı ayarlarında ne seçtiğini açar - sekme veya pencere. Test ettiğiniz tarayıcılarda, ayarları bir sekme yerine yeni bir pencerede açmak için değiştirin ve diğerlerinin çözümlerinin yanlış olduğunu görürsünüz. - Ian
Başka insanların zamanlarını boşa harcayan iki şey, onlara bir şey söylemekten daha fazlası olamaz. (1) Onlara yapamayacak bir şey söylemek kutu yapıldı. (2) Sessiz kalmak ve yapamayacak bir şey yapmanın bir yolunu aramaya devam etmek. - Quentin
@Cupcake - Dokümantasyon genellikle mevcut olmayan özellikleri açıklamakla uğraşmaz. evernote.com/shard/s3/sh/428d2d68-39f9-491d-8352-8a9c217b67d7/... - Quentin
@Neel - Çünkü bir çok insanın bilmek istediği bir konuya kısa sürede ulaşıyor. - Quentin


Bu bir oyun

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

Çoğu durumda, bu doğrudan doğruya onclick Pop-up engelleyicileri ve varsayılan "yeni pencere" davranışını önlemek için bağlantı için işleyici. Bunu bu şekilde yapabilir veya bir etkinlik dinleyicisi ekleyerek DOM nesne.

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

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


1263
2017-07-08 14:49



Çalışmıyor. Adres çubuğunun sağında bir mesaj var: Pop-up engellendi. Sonra pop-up'lara izin verdim. Ve voilà, bir açılır pencerede açılır, bir değil çıkıntı! OS X Lion üzerinde 22.0.1229.94 numaralı Chrome. - nalply
Bence bu kadar çok insanın sorunlarının olmasının sebebi, düzgün bir şekilde uygulamamasıdır (nasıl göremiyorum ki). Vanilla'da test edilmiştir: Chrome, IE, FF, SeaMonkey, Safari ve Opera. ÇALIŞIYOR bir cazibe gibi. - b1nary.atr0phy
@Dhaval Tarayıcınızdaki ayarları değiştirin. Bir sekmede veya pencerede açılmış olsun, tarayıcınızın ayarları tarafından belirlenir. Arayarak yapabileceğin hiçbir şey yok window.open (veya herhangi bir Javascript) seçmek için Nasıl yeni pencereyi / sekmeyi açmak için - Ian
@ b1naryatr0phy Bunun nedeni, aslında düzgün bir şekilde test etmediğiniz içindir. Tarayıcılarınızdaki ayarları değiştirin. Bir sekmede veya pencerede açılmış olsun, tarayıcınızın ayarları tarafından belirlenir. Yeni pencereyi / sekmeyi nasıl açacağınızı seçmek için window.open (veya herhangi bir Javascript) çağırarak yapabileceğiniz hiçbir şey yoktur. - Ian
@duke OP'nin kodunu kullanarak yeni bir sayfa açtığınızda, yeni sayfa yeni bir pencerede açılır ve sizinkiyle yeni bir sekmede açılır. Şimdiye kadar teklif vermediniz herhangi Bu kodun çalıştığı örnek ve diğerleri, (başarısız olduğunu iddia ettikleri) bol teklif ettiler. - Mark Amery


window.open() gerçek tıklama etkinliğinde olmuyorsa yeni bir sekmede açılmaz. Verilen örnekte, URL gerçek tıklama etkinliğinde açılır. Bu, kullanıcının tarayıcıda uygun ayarlara sahip olması koşuluyla çalışır.

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

Benzer şekilde, tıklama işlevinde bir Ajax araması yapmaya çalışıyorsanız ve başarıda bir pencere açmak istiyorsanız, Ajax çağrısı yaptığınızdan emin olun. async : false seçenek kümesi.


316
2017-10-31 13:15



Bunu DOĞRU cevap olarak işaretlemek güzel olurdu. Chrome v26 (Windows) ile yaptığım testler, kodun bir düğmenin tıklama işleyicisi içerisindeyse, yeni bir sekme açtığını ve kodun program aracılığıyla çağrıldığını doğrular. konsoldan sonra yeni bir pencere açar. - CyberFonic
@CyberFonic Doğru bir cevap olmadığı için bunu yapmak için bir sebep yok. Yeni sekmenin / tarayıcının nasıl açıldığını belirleyemez. Javascript'ten kontrol edemezsin. Tarayıcınızın ayarları tarafından belirlenir. - Ian
@PaulBrown Bu cevap diğerlerinden farklı değil. Hepsi kullanım diyor window.open. "_Blank" olan ikinci parametre hiçbir şeyi değiştirmez. Bu yüzden burada bir fark yok. Ve iddia ettikleri gerçek "window.open()gerçek tıklama olayında olmuyorsa yeni sekmede açılmayacaktır. "de yanlıştır. Tarayıcıdaki ayarlar herhangi bir şey için akıl yürütmedir, Javascript kodu değil - Ian
@PaulBrown Neden onu kontrol edemediğinizi kabul etmeyeceğinizi bilmiyorum. Tüm CyberFonic, tarayıcılar arasında hala bir tutarsızlık olduğunu açıkladı / kanıtladı ve bu güvensizliği gösterdi. window.open Aramalar güvenli olanlardan farklıdır. Sadece Firefox ve IE'de aynı şeyi test ettim ve her ikisi de yeni bir sekmede açıldı. İşte bir örnek, böylece küçük kalbinizi test edebilirsiniz: jsfiddle.net/gEuMK . Gerçek, güvenli bir olay veya rastgele / güvensiz olanı kontrol edemeseniz bile, neden tarayıcılar arasında tutarsız bir çözümü ve yalnızca “eserler” ini neden desteklediniz? - Ian
@PaulBrown Hayır, öyle değil. Orada yok hayır Bir sekmenin açılmasını garantiler (Javascript'in bakış açısından). Sekmeler açılır, çünkü tarayıcımın varsayılan ayarları bir sekmede açılır. Sizin ve başkaları için çalışır çünkü varsayılan ayarlarınız muhtemelen aynıdır. Soru "Yeni bir sekmede bir URL nasıl açılır" dedi. Bu ve diğer tüm sorular kodla, "Tarayıcının varsayılan ayarlarına göre bir URL nasıl açılır" yanıtları. Ve bana göre, OP istiyor tam kontrol. Bir şey olmasını isterlerse, cevap Yapmak bu olur. Bu cevaplar belki bunu gerçekleştir - Ian


window.open Tüm Tarayıcılarda Açılır Pencereleri Yeni Bir Sekmede Güvenli Olarak Açamıyor

Farklı tarayıcılar davranışını uygular  window.open  Özellikle kullanıcının tarayıcı tercihlerine göre farklı şekillerde. Aynı davranışı bekleyemezsiniz window.open Bir kullanıcının tarayıcı tercihlerini ele almanın farklı yolları nedeniyle, tüm Internet Explorer, Firefox ve Chrome'da doğru olmak.

Örneğin, Internet Explorer (11) kullanıcıları açılır pencereleri yeni bir pencerede veya yeni bir sekmede açmayı seçebilir. Internet Explorer 11 kullanıcılarını, belirli bir şekilde açılır pencereleri açmaya zorlayamazsınız.  window.open, içinde olduğu gibi Quentin'in cevabı.

Firefox (29) kullanıcıları için window.open(url, '_blank')  tarayıcılarının sekme tercihlerine göre değişir, Yine de, genişlik ve yükseklik belirterek yeni bir pencerede açılır pencereleri açmaya zorlayabilirsiniz (bkz. "Chrome Hakkında?" bölümü).

gösteri

Tarayıcınızın ayarlarına gidin ve yeni bir pencerede açılır pencereleri açmak için yapılandırın.

Internet Explorer (11)

Internet Explorer settings dialog 1

Internet Explorer tab settings dialog

Test Sayfası

Yukarıda gösterildiği gibi yeni bir pencerede açılır pencereleri açmak için Internet Explorer'ı (11) kurduktan sonra, sınamak için aşağıdaki sınama sayfasını kullanın. 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>

Pop-up'ların açıldığını gözlemleyin yeni bir pencerede değil, yeni bir sekmede.

Ayrıca bu parçacıkları Firefox'ta (29) yeni pencerelere ayarlanmış sekme tercihi ile test edebilir ve aynı sonuçları görebilirsiniz.

Chrome hakkında ne? Uygular window.open Internet Explorer (11) ve Firefox'tan (29) farklıdır.

% 100 emin değilim, ancak Chrome'a ​​benziyor (sürüm 34.0.1847.131 m) kullanıcının yeni bir pencerede veya yeni bir sekmede (Firefox ve Internet Explorer gibi) açılıp açılmayacağını seçmek için kullanabileceği herhangi bir ayar bulunmuyor. kontrol ettim Pop-up'ları yönetmek için Chrome belgeleriama bu tür şeyler hakkında bir şey söylemedi.

Ayrıca, Bir kez daha, farklı tarayıcılar davranışını uygulamak gibi görünüyor  window.open  farklı. Chrome ve Firefox'ta bir genişlik ve yükseklik belirtmek, bir pop-up'ı zorlayacaktır Bir kullanıcı Firefox'u (29) yeni bir sekmede yeni pencereleri açmaya ayarladığında bile (yanıtlarda da belirtildiği gibi) JavaScript yeni bir pencerede açılır, sekme değil):

<!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>

Ancak, yukarıdaki aynı kod snippet'i Kullanıcılar tarayıcı tercihleri ​​olarak sekmeler ayarlarsa, Internet Explorer 11'de her zaman yeni bir sekme açar bir genişlik ve yükseklik belirtmemek bile onlar için yeni bir pencere açılmasını zorlayacaktır.

Yani davranışları window.open Chrome'da, yeni bir sekmede kullanıldığında pop-up'ları açmak olacak gibi görünüyor. onclick etkinliği, tarayıcı konsolundan kullanıldığında yeni pencerelerde açmak içindiğer insanlar tarafından belirtildiği gibi) ve genişlik ve yükseklik ile belirtildiğinde yeni pencerelerde açabilirsiniz.

özet

Farklı tarayıcılar davranışını uygular  window.open  kullanıcıların tarayıcı tercihleri ​​ile ilgili olarak farklı. Aynı davranışı bekleyemezsiniz window.open Bir kullanıcının tarayıcı tercihlerini ele almanın farklı yolları nedeniyle, tüm Internet Explorer, Firefox ve Chrome'da doğru olmak.

Ek Okuma


224
2018-05-01 19:42



Soruyu cevaplamadın, sadece window.open'in tutarsız olduğunu kanıtladın. - BentOnCoding


Bir astar:

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

veya

İle jQuery Bunu kullanıyorum:

var url = "http://google.com";
$("<a>").attr("href", url).attr("target", "_blank")[0].click();

Sanal oluşturuyor a eleman verir target="_blank" bu yüzden yeni sekmede açılır, düzgün bir şekilde verir url  href ve sonra onu tıklar.

Ve eğer isterseniz, buna bağlı olarak bazı fonksiyonlar yaratabilirsiniz:

function openInNewTab(url) {
    $("<a>").attr("href", url).attr("target", "_blank")[0].click();
}

ve sonra şöyle kullanabilirsiniz:

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

İçin olmayan jQuery senaryo, işlev şöyle görünürdü:

function openInNewTab(url) {
    var a = document.createElement("a");
    a.target = "_blank";
    a.href = url;
    a.click();
}

// And then
openInNewTab("http://google.com");

136
2018-02-06 20:35



Teşekkür ederim. Saf-JS'nizde eksik bir parça var - Luke Alderton'un yazdığı gibi (aşağıya bakınız), belge gövdesine yaratılan öğeyi eklemeniz gerekiyor, kodunuzda en azından Firefox 37'de asılı kalıyor ve hiçbir şey yapmıyor . - greenoldman
@mcginniwa Bunun gibi herhangi bir eylem - fare tıklaması gibi kullanıcı eylemi tarafından tetiklenmezse, popup-blocker açılır. Herhangi bir URL'yi kullanıcı eylemi olmadan Javascript ile açabileceğinizi düşünün. Bu oldukça tehlikeli olur. Bu kodu tıklama işlevi gibi etkinliğin içine koyarsanız - iyi çalışır - burada önerilen tüm çözümlerle aynıdır. - pie6k
Bu benim ilk düşüncemdi. Muhtemelen pop-up engelleyicileri düşünerek en iyi düşünürdüm. - Arg0n
Kodunuzu aşağıdaki gibi basitleştirebilirsiniz: $('<a />',{'href': url, 'target', '_blank'}).get(0).click(); - shaedrich
senin snipped tarafından ilham @shaedrich ben jquery olmayan tek liner eklendi: Object.assign(document.createElement('a'), { target: '_blank', href: 'URL_HERE'}).click(); - pie6k


Steven Spielberg'in cevabını detaylandırmak için böyle bir durumda yaptım:

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

Bu şekilde, tarayıcı linki takip etmeden hemen önce hedef niteliğini ayarlıyorum, bu yüzden bağlantıyı yeni bir sekmede veya pencerede açacaktır (kullanıcının ayarlarına bağlıdır).


55
2018-04-05 15:02





Eğer kullanırsan window.open(url, '_blank')Chrome'da engellenir (popup engelleyici).

Bunu dene:

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

51
2018-05-28 16:43



Bu, kabul edilen cevap olarak görmeyi beklediğim şey, bu seçeneği kullanmamanın bir nedeni var mı? Chrome, Safari ve IE11'de test ettim ve bu tarayıcılarda iyi çalışıyor, ancak mobil ve LTE hakkında bir fikir yok (IE10) - cloying
Bu yeni bir pencerede açılabilir. Bu yeni bir sekmede açılabilir. Bu site yazarının kontrolü altında değildir. Bu kod, OP'nin kendileri için çalışmadığını söyleyen sorudaki kodla aynıdır. - Quentin
Teşekkürler iyi çalışır, ancak popup'ları işlemek için tarayıcı ayarı gereklidir. - chetan
Bunun gerçekten iyi bir çözüm olabileceğini düşünüyorum çünkü yeni bir sekme açmanın beklendiği gibi çalışıyor ve reklam engelleyicileri veya açılır pencere engelleyicileriyle bile iyi çalışıyor - LucioB
Bu, hem FF hem de kromda çalışmıyor. - Faisal Mq