Vraag Open een URL in een nieuw tabblad (en niet een nieuw venster) met behulp van JavaScript


Ik probeer een te openen URL in een nieuw tabblad, in tegenstelling tot een pop-upvenster. Ik heb gerelateerde vragen gezien waarbij de antwoorden er ongeveer zo zouden uitzien:

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

Maar geen van hen werkte voor mij, de browser probeerde nog steeds een pop-upvenster te openen.


1588
2018-02-05 15:52


oorsprong


antwoorden:


Niets wat een auteur kan doen, kan ervoor kiezen om te openen op een nieuw tabblad in plaats van een nieuw venster. Het is een gebruikersvoorkeur.

CSS3 voorgesteld target-new, maar de specificatie is verlaten.

De omgekeerde is niet waar; door dimensies voor het venster op te geven in het derde argument van window.open, kunt u een nieuw venster activeren wanneer de voorkeur voor tabbladen is.


699
2018-02-05 15:53



Dit is een truc,

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

In de meeste gevallen zou dit direct in de onclick handler voor de link om pop-upblokkers te voorkomen, en het standaard gedrag "nieuw venster". Je zou het op deze manier kunnen doen, of door een gebeurtenislistener aan je toe te voegen DOM voorwerp.

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

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


1256
2017-07-08 14:49



window.open() wordt niet geopend in een nieuw tabblad als dit niet gebeurt bij de daadwerkelijke klikgebeurtenis. In het gegeven voorbeeld wordt de URL geopend op de daadwerkelijke klikgebeurtenis. Dit werkt als de gebruiker de juiste instellingen in de browser heeft.

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

Evenzo, als u probeert een Ajax-oproep te doen binnen de klikfunctie en een venster wilt openen met succes, zorgt u ervoor dat u de Ajax-oproep doet met de async : false optie ingesteld.


315
2017-10-31 13:15



window.open Kan pop-ups niet op een betrouwbare manier openen in een nieuw tabblad in alle browsers

Verschillende browsers implementeren het gedrag van  window.open  op verschillende manieren, vooral met betrekking tot de browservoorkeuren van een gebruiker. Je kunt niet hetzelfde gedrag verwachten voor window.open om waar te zijn in alle Internet Explorer, Firefox en Chrome, vanwege de verschillende manieren waarop ze omgaan met de browservoorkeuren van een gebruiker.

Gebruikers van Internet Explorer (11) kunnen er bijvoorbeeld voor kiezen om pop-ups in een nieuw venster of een nieuw tabblad te openen, je kunt Internet Explorer 11-gebruikers niet dwingen pop-ups op een bepaalde manier te openen  window.open, zoals vermeld in Quentins antwoord.

Wat betreft gebruikers van Firefox (29), met behulp van window.open(url, '_blank')  hangt af van de tabvoorkeuren van hun browser, hoewel je ze nog steeds kunt dwingen pop-upvensters in een nieuw venster te openen door een breedte en hoogte op te geven (zie het gedeelte 'Wat met Chrome?' hieronder).

Demonstratie

Ga naar de instellingen van je browser en configureer het om pop-ups in een nieuw venster te openen.

Internet Explorer (11)

Internet Explorer settings dialog 1

Internet Explorer tab settings dialog

Testpagina

Nadat u Internet Explorer (11) hebt ingesteld om pop-ups in een nieuw venster te openen zoals hierboven is aangetoond, gebruikt u de volgende testpagina om te testen 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>

Merk op dat de pop-ups worden geopend in een nieuw venster, geen nieuw tabblad.

U kunt deze fragmenten hierboven ook testen in Firefox (29), waarbij de tabvoorkeur is ingesteld op nieuwe vensters en u dezelfde resultaten ziet.

Hoe zit het met Chrome? Het implementeert window.open Anders dan in Internet Explorer (11) en Firefox (29).

Ik ben er niet 100% zeker van, maar het ziet eruit als Chrome (versie 34.0.1847.131 m) lijkt geen instellingen te hebben die de gebruiker kan gebruiken om te kiezen om pop-ups in een nieuw venster of een nieuw tabblad (zoals Firefox en Internet Explorer) te openen of niet. Ik controleerde de Chrome-documentatie voor het beheren van pop-ups, maar het heeft niets gezegd over dat soort dingen.

Ook, wederom lijken verschillende browsers het gedrag van te implementeren  window.open  anders. In Chrome en Firefox, het opgeven van een breedte en hoogte dwingt een pop-up, zelfs wanneer een gebruiker Firefox (29) heeft ingesteld om nieuwe vensters te openen in een nieuw tabblad (zoals vermeld in de antwoorden op JavaScript geopend in een nieuw venster, geen tabblad):

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

Hetzelfde codefragment hierboven echter zal altijd een nieuw tabblad openen in Internet Explorer 11 als gebruikers tabbladen instellen als hun browservoorkeuren, zelfs als u geen breedte en hoogte opgeeft, wordt er een pop-up met een nieuw venster voor geforceerd.

Dus het gedrag van window.open in Chrome lijkt te zijn om pop-ups in een nieuw tabblad te openen wanneer gebruikt in een onclick gebeurtenis, om ze in nieuwe vensters te openen wanneer ze worden gebruikt via de browserconsole (zoals opgemerkt door andere mensen) en om ze in nieuwe vensters te openen als ze worden gespecificeerd met een breedte en een hoogte.

Overzicht

Verschillende browsers implementeren het gedrag van  window.open  anders met betrekking tot de browservoorkeuren van gebruikers. Je kunt niet hetzelfde gedrag verwachten voor window.open om waar te zijn in alle Internet Explorer, Firefox en Chrome, vanwege de verschillende manieren waarop ze omgaan met de browservoorkeuren van een gebruiker.

Extra lezen


224
2018-05-01 19:42



Oneliner:

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

of

Met jQuery Ik gebruik deze:

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

Het creëert een virtueel a element, geeft het target="_blank" dus opent het in een nieuw tabblad, geeft het juist url  href en klik er vervolgens op.

En als je wilt, kun je op basis daarvan een functie maken:

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

en dan kun je het gebruiken als:

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

Voor een non-jQuery scenario zou de functie er als volgt uitzien:

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



Om het antwoord van Steven Spielberg uit te werken, deed ik dit in zo'n geval:

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

Op deze manier, net voordat de browser de link volgt, stel ik het doelattribuut in, zodat de link wordt geopend in een nieuw tabblad of venster (hangt af van de instellingen van de gebruiker).


55
2018-04-05 15:02



Als je gebruikt window.open(url, '_blank'), het wordt geblokkeerd (pop-upblokkering) in Chrome.

Probeer dit:

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

51
2018-05-28 16:43



Ik gebruik het volgende en het werkt erg goed !!!

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

29
2018-03-11 11:51



Een interessant feit is dat het nieuwe tabblad niet kan worden geopend als de actie niet wordt aangeroepen door de gebruiker (klikken op een knop of iets) of als het asynchroon is, dit wordt bijvoorbeeld NIET geopend in een nieuw tabblad:

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

Maar dit kan openen in een nieuw tabblad, afhankelijk van de browserinstellingen:

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

14
2017-10-18 12:35



Ik denk dat je dit niet kunt beheersen. Als de gebruiker zijn browser had ingesteld om links in een nieuw venster te openen, kunt u dit niet dwingen om links op een nieuw tabblad te openen.

JavaScript geopend in een nieuw venster, geen tabblad


13
2018-02-05 15:55



Als u de parameters [strWindowFeatures] gewoon weglaat, wordt een nieuw tabblad geopend, TENZIJ de browser-instelling overschrijft (browserinstelling troeft JavaScript).

Nieuw raam

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

Nieuw tabblad

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

- of -

var myWin = window.open(strUrl);

13
2017-11-18 09:14