Frage Öffnen Sie eine URL in einem neuen Tab (und nicht in einem neuen Fenster) mit JavaScript


Ich versuche ein zu öffnen URL in einem neuen Tab, im Gegensatz zu einem Popup-Fenster. Ich habe ähnliche Fragen gesehen, bei denen die Antworten etwa wie folgt aussehen würden:

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

Aber keiner von ihnen funktionierte für mich, der Browser versuchte immer noch ein Popup-Fenster zu öffnen.


1588
2018-02-05 15:52


Ursprung


Antworten:


Nichts, was ein Autor tun kann, kann in einem neuen Tab statt in einem neuen Fenster geöffnet werden. Es ist ein Benutzerpräferenz.

CSS3 vorgeschlagen Ziel neu, aber Die Spezifikation wurde aufgegeben.

Das umkehren ist nicht wahr; durch Angabe von Dimensionen für das Fenster im dritten Argument von window.open, können Sie ein neues Fenster auslösen, wenn die Voreinstellung für Tabs ist.


699
2018-02-05 15:53



Das ist ein Trick,

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

In den meisten Fällen sollte dies direkt in der onclick Handler für die Verbindung, um Popup-Blocker zu verhindern, und das Standardverhalten "neues Fenster". Sie können dies auf diese Weise tun oder indem Sie einen Ereignis-Listener zu Ihrem hinzufügen DOM Objekt.

<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() wird nicht in einem neuen Tab geöffnet, wenn dies beim aktuellen Klickereignis nicht geschieht. Im Beispiel wird die URL für das aktuelle Klickereignis geöffnet. Dies funktioniert, vorausgesetzt der Benutzer verfügt über entsprechende Einstellungen im Browser.

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

Wenn Sie versuchen, einen Ajax-Aufruf innerhalb der Klickfunktion auszuführen und ein Fenster für den Erfolg öffnen möchten, stellen Sie sicher, dass Sie den Ajax-Aufruf mit der Funktion ausführen async : false Optionssatz.


315
2017-10-31 13:15



window.open Popups können nicht zuverlässig in einem neuen Tab in allen Browsern geöffnet werden

Verschiedene Browser implementieren das Verhalten von  window.open  auf unterschiedliche Weise, insbesondere im Hinblick auf die Browsereinstellungen eines Benutzers. Sie können nicht das gleiche Verhalten für erwarten window.open in allen Internet Explorer-, Firefox- und Chrome-Versionen wahr sein, da sie die Browsereinstellungen eines Benutzers unterschiedlich handhaben.

Beispielsweise können Benutzer von Internet Explorer (11) Popups in einem neuen Fenster oder einem neuen Tab öffnen. Sie können Internet Explorer 11-Benutzern nicht das Öffnen von Popups auf bestimmte Weise erzwingen  window.openwie schon angedeutet Quentins Antwort.

Wie für Firefox (29) Benutzer, die window.open(url, '_blank')  hängt von den Voreinstellungen ihres Browsers ab, Sie können sie dennoch dazu zwingen, Popups in einem neuen Fenster zu öffnen, indem Sie eine Breite und Höhe angeben (siehe Abschnitt "Was ist mit Chrome?").

Demonstration

Gehe zu den Einstellungen deines Browsers und konfiguriere es, um Popups in einem neuen Fenster zu öffnen.

Internet Explorer (11)

Internet Explorer settings dialog 1

Internet Explorer tab settings dialog

Testseite

Nachdem Sie den Internet Explorer (11) eingerichtet haben, um Popups in einem neuen Fenster zu öffnen, wie oben gezeigt, verwenden Sie die folgende Testseite zum 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>

Beachten Sie, dass die Popups geöffnet sind in einem neuen Fenster, nicht eine neue Registerkarte.

Sie können diese oben genannten Snippets auch in Firefox (29) testen, wobei die Tab-Voreinstellung auf neue Fenster eingestellt ist und dieselben Ergebnisse angezeigt werden.

Was ist mit Chrome? Es implementiert window.open Anders als beim Internet Explorer (11) und Firefox (29).

Ich bin mir nicht 100% sicher, aber es sieht aus wie Chrome (Version 34.0.1847.131 m) scheint keine Einstellungen zu enthalten, mit denen der Benutzer auswählen kann, ob er Popups in einem neuen Fenster oder einem neuen Tab öffnet (wie Firefox und Internet Explorer). Ich überprüfte die Chrome-Dokumentation zum Verwalten von Pop-ups, aber es hat nichts über solche Dinge gesagt.

Ebenfalls, Auch hier scheinen verschiedene Browser das Verhalten von  window.open  anders. In Chrome und Firefox die Angabe einer Breite und Höhe erzwingt ein Popup, selbst wenn ein Benutzer Firefox (29) so eingestellt hat, dass er neue Fenster in einem neuen Tab öffnet (wie in den Antworten zu JavaScript wird in einem neuen Fenster, nicht in einem Tab geöffnet):

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

Das gleiche Code-Snippet oben wird immer eine neue Registerkarte in Internet Explorer 11 öffnen, wenn Benutzer Registerkarten als Browsereinstellungen festlegen, Wenn Sie nicht einmal eine Breite und Höhe angeben, wird ein neues Popup-Fenster für sie erstellt.

Also das Verhalten von window.open In Chrome scheint es, Popups in einem neuen Tab zu öffnen, wenn sie in einem onclick Ereignis, um sie in neuen Fenstern zu öffnen, wenn sie von der Browser-Konsole verwendet werden (wie von anderen Personen erwähnt) und in neuen Fenstern zu öffnen, wenn sie mit einer Breite und einer Höhe angegeben werden.

Zusammenfassung

Verschiedene Browser implementieren das Verhalten von  window.open  anders in Bezug auf die Browsereinstellungen des Benutzers. Sie können nicht das gleiche Verhalten für erwarten window.open in allen Internet Explorer-, Firefox- und Chrome-Versionen wahr sein, da sie die Browsereinstellungen eines Benutzers unterschiedlich handhaben.

Zusätzliches Lesen


224
2018-05-01 19:42



Einzeiler:

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

oder

Mit jQuery Ich benutze dieses:

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

Es erstellt ein virtuelles a Element, gibt es target="_blank" so öffnet es sich in einem neuen Tab, gibt es richtig url  href und klickt dann darauf.

Und wenn Sie möchten, können Sie basierend darauf eine Funktion erstellen:

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

und dann kannst du es benutzen wie:

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

Für ein Nicht-jQuery Szenario würde die Funktion so aussehen:

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



Um Steven Spielbergs Antwort zu erläutern, tat ich das in einem solchen Fall:

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

Auf diese Weise, kurz bevor der Browser dem Link folgt, setze ich das target-Attribut, damit der Link in einem neuen Tab oder Fenster geöffnet wird (hängt von den Benutzereinstellungen ab).


55
2018-04-05 15:02



Wenn du benutzt window.open(url, '_blank')Es wird in Chrome blockiert (Popup-Blocker).

Versuche dies:

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

51
2018-05-28 16:43



Ich benutze folgendes und es funktioniert sehr gut !!!

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

29
2018-03-11 11:51



Eine interessante Tatsache ist, dass die neue Registerkarte nicht geöffnet werden kann, wenn die Aktion nicht vom Benutzer aufgerufen wird (durch Klicken auf eine Schaltfläche oder etwas) oder wenn sie zum Beispiel asynchron ist und nicht in der neuen Registerkarte geöffnet wird:

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

Je nach Browsereinstellungen kann dies jedoch in einem neuen Tab geöffnet werden:

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

14
2017-10-18 12:35



Ich denke, dass du das nicht kontrollieren kannst. Wenn der Benutzer seinen Browser so eingerichtet hat, dass er Links in einem neuen Fenster öffnet, können Sie dies nicht erzwingen, um Links in einem neuen Tab zu öffnen.

JavaScript wird in einem neuen Fenster, nicht in einem Tab geöffnet


13
2018-02-05 15:55



Wenn Sie [strWindowFeatures] -Parameter einfach weglassen, wird eine neue Registerkarte geöffnet, sofern die Browsereinstellung nicht überschrieben wird (die Browsereinstellung übertrumpft JavaScript).

Neues Fenster

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

Neue Registerkarte

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

-- oder --

var myWin = window.open(strUrl);

13
2017-11-18 09:14