Öffnen Sie eine URL in einem neuen Tab (und nicht in einem neuen Fenster).

2102

Ich versuche, eine URL in einem neuen Tab zu öffnen , im Gegensatz zu einem Popup-Fenster.

Ich habe verwandte Fragen gesehen, bei denen die Antworten ungefähr so ​​aussehen würden:

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

Aber keiner von ihnen hat bei mir funktioniert, der Browser hat immer noch versucht, ein Popup-Fenster zu öffnen.

javascript Kennzeichen
quelle
85
Dies ist normalerweise eine Frage der Präferenz. Einige Leute mögen Fenster (und schützen dieses Verhalten nachdrücklich), andere Registerkarten (und schützen dieses Verhalten nachdrücklich). Sie würden also ein Verhalten besiegen, das allgemein als Geschmackssache und nicht als Design angesehen wird.
Jared Farrish
42
Javascript weiß nichts über Ihren Browser und Ihre Registerkarten im Vergleich zu Windows. Es liegt also wirklich am Browser, zu entscheiden, wie ein neues Fenster geöffnet werden soll.
Andrey
3
Wie kann ich Chrome so konfigurieren, dass es in einem neuen Tab angezeigt wird, im Gegensatz zu einem Popup?
Mark
8
Google Mail macht das irgendwie, zumindest in Chrome. Umschalt + Klicken Sie auf eine E-Mail-Zeile und Sie öffnen diese E-Mail in einem neuen Fenster. Strg + Klick und Sie öffnen es in einem neuen Tab. Einziges Problem: Das Durchsuchen des verschleierten Codes von Google Mail ist ein PITA
Sergio
48
@Sergio, das ist das Standardverhalten des Browsers für jeden Link. (Zumindest für Chrome und Firefox.) Hat nichts mit Google Mail zu tun.
Qtax

Antworten:

929

Nichts, was ein Autor tun kann, kann sich dafür entscheiden, in einem neuen Tab anstelle eines neuen Fensters zu öffnen. Es ist eine Benutzerpräferenz . (Beachten Sie, dass die Standardbenutzereinstellung in den meisten Browsern für neue Registerkarten gilt. Ein trivialer Test in einem Browser, in dem diese Einstellung nicht geändert wurde, zeigt dies nicht.)

CSS3 schlug ein neues Ziel vor , aber die Spezifikation wurde aufgegeben .

Das Gegenteil ist nicht der Fall; Durch Angabe der Abmessungen für das Fenster im dritten Argument von window.open()können Sie ein neues Fenster auslösen, wenn Registerkarten bevorzugt werden.

QUentin
quelle
42
@AliHaideri Das Javascript hat nichts damit zu tun, wie der neue Tab / das neue Fenster geöffnet wird. Alles hängt von den Einstellungen Ihres Browsers ab. Wenn Sie verwenden, window.openwird der Browser angewiesen, etwas Neues zu öffnen. Anschließend öffnet der Browser die in den Einstellungen ausgewählten Elemente - Registerkarte oder Fenster. Ändern Sie in den Browsern, mit denen Sie getestet haben, die Einstellungen so, dass sie in einem neuen Fenster anstelle einer Registerkarte geöffnet werden, und Sie werden feststellen, dass die Lösungen der anderen falsch sind.
Ian
239
Zwei Dinge, die die Zeit anderer Menschen mehr verschwenden, als ihnen etwas zu sagen, können nicht getan werden. (1) Ihnen etwas zu sagen, was nicht getan werden kann , kann getan werden. (2) Schweigen und sie nach einem Weg suchen lassen, etwas zu tun, was nicht getan werden kann.
Quentin
8
@Cupcake - Die Dokumentation beschreibt normalerweise keine Funktionen, die nicht vorhanden sind. evernote.com/shard/s3/sh/428d2d68-39f9-491d-8352-8a9c217b67d7/…
Quentin
9
@Neel - Weil es kurz und bündig zu einem Thema kommt, über das viele Leute wissen wollen.
Quentin
4
Autoren können Dinge tun (meistens schreiben sie unterschiedlichen Code). Keines dieser Dinge löst eine Registerkarte anstelle eines Fensters aus.
Quentin
1733

Das ist ein Trick, 

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

In den meisten Fällen sollte dies direkt im onclickHandler für den Link geschehen , um Popup-Blocker und das Standardverhalten "Neues Fenster" zu verhindern. Sie können dies auf diese Weise tun oder indem Sie Ihrem DOMObjekt einen Ereignis-Listener hinzufügen . 

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

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

Rinto George
quelle
117
Funktioniert nicht. Rechts in der Adressleiste wurde eine Meldung angezeigt : Popup blockiert . Dann habe ich Popups zugelassen. Und voilà, es öffnet sich in einem Popup, nicht in einem Tab ! Chrome 22.0.1229.94 unter OS X Lion.
Nalply
39
@ b1naryatr0phy Das liegt daran, dass du es nicht richtig getestet hast. Ändern Sie die Einstellungen in Ihren Browsern. Ob es in einem Tab oder Fenster geöffnet wird, hängt von den Einstellungen Ihres Browsers ab. Sie können nichts tun, indem Sie window.open (oder ein beliebiges Javascript) aufrufen, um auszuwählen, wie das neue Fenster / die neue Registerkarte geöffnet werden soll.
Ian
Frage: Ich habe eine URL ohne Protokoll festgelegt (z. B. my.site.com/Controller/Index). Als Ergebnis erhalte ich ein neues Fenster (Tab) anhand der URL, z. B. der URL der aktuellen Seite (von wo aus ich die Funktion OpenInNewTab verwende) und die an die Funktions-URL übergeben wird. Mit Protokoll öffnet sich das Fenster durch korrekten Link. Warum?
user2167382
2
var win = window.open (url, '_blank'); Das '_blank' ist nicht erforderlich. Für window.open () lautet der zweite Parameter strWindowName für: Ein Zeichenfolgenname für das neue Fenster. Der Name kann als Ziel von Links und Formularen verwendet werden, indem das Zielattribut eines <a> - oder <form> -Elements verwendet wird. Der Name sollte keine Leerzeichen enthalten. Beachten Sie, dass strWindowName den Titel des neuen Fensters nicht angibt.
HydRAnger
Gibt es eine Möglichkeit, dies zu öffnen, ohne dass es sich um einen Sandbox-Iframe handelt? Wenn ich dies verwende, erhalte ich CORS-Fehler, da der Wert von document.domain nicht geändert wird, da er als Iframe geöffnet wird.
Ids van der Zee
380

window.open()wird nicht in einer neuen Registerkarte geöffnet, wenn dies beim tatsächlichen Klickereignis nicht der Fall ist. In dem angegebenen Beispiel wird die URL beim eigentlichen Klickereignis geöffnet. Dies funktioniert, sofern der Benutzer über die entsprechenden Einstellungen im Browser verfügt .

<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 bei Erfolg ein Fenster öffnen möchten, stellen Sie sicher, dass Sie den Ajax-Aufruf mit der festgelegten async : falseOption ausführen.

Venkat Kotra
quelle
28
Wäre schön, diese als die RICHTIGE Antwort zu markieren. Meine Tests mit Chrome v26 (Windows) bestätigen, dass der Code im Klick-Handler einer Schaltfläche eine neue Registerkarte öffnet. Wenn der Code programmgesteuert aufgerufen wird, z. B. über die Konsole, wird ein neues Fenster geöffnet.
CyberFonic
2
@Ian Nach meinen Tests in Browsern mit Standardeinstellungen funktioniert diese Antwort in Fällen, in denen die obigen Antworten nicht zutreffen. Die akzeptierte Antwort "Es gibt nichts, was Sie tun können" ist nur wahr, wenn der Benutzer die Standardeinstellungen geändert hat.
Garfield
@ Ian Aus Gründen der Klarheit habe ich dies in der Antwortwarnung zu den Benutzereinstellungen erwähnt. "Dies funktioniert, sofern der Benutzer über die entsprechenden Einstellungen im Browser verfügt." Ich denke, die Mehrheit der Benutzer ändert die Browsereinstellungen nicht und diese Antwort funktioniert für die meisten von ihnen.
Venkat Kotra
async: falsefunktioniert nicht in Chrome. Um ein neues Fenster über den Rückruf zu öffnen, müssen Sie zuerst ein leeres Fenster öffnen, bevor Sie die HTTP-Anforderung senden und später aktualisieren. Hier ist ein guter Hack .
Attacomsian
250

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

Verschiedene Browser implementieren das Verhalten window.open auf unterschiedliche Weise, insbesondere im Hinblick auf die Browsereinstellungen eines Benutzers. Sie können nicht erwarten, dass dasselbe Verhalten für window.openalle Bereiche von Internet Explorer, Firefox und Chrome gilt, da die Browsereinstellungen eines Benutzers unterschiedlich behandelt werden.

Beispielsweise können Benutzer von Internet Explorer (11) Popups in einem neuen Fenster oder auf einer neuen Registerkarte öffnen. Sie können Benutzer von Internet Explorer 11 nicht zwingen, Popups auf eine bestimmte Weise zu öffnen window.open , wie in Quentins Antwort erwähnt .

Für Firefox (29) -Nutzer window.open(url, '_blank') hängt die Verwendung von den Registerkarteneinstellungen ihres Browsers ab. Sie können sie jedoch weiterhin zwingen, Popups in einem neuen Fenster zu öffnen, indem Sie eine Breite und Höhe angeben (siehe Abschnitt "Was ist mit Chrome?" Unten).

Demonstration

Gehen Sie zu den Einstellungen Ihres Browsers und konfigurieren Sie ihn so, dass Popups in einem neuen Fenster geöffnet werden.

Internet Explorer (11)

Internet Explorer-Einstellungsdialog 1

Einstellungsdialog der Registerkarte "Internet Explorer"

Testseite

Verwenden Sie nach dem Einrichten von Internet Explorer (11) zum Öffnen von Popups in einem neuen Fenster wie oben gezeigt 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 in einem neuen Fenster und nicht auf einer neuen Registerkarte geöffnet werden .

Sie können diese Schnipsel auch oben in Firefox (29) testen, wobei die Registerkarteneinstellung auf neue Fenster eingestellt ist, und dieselben Ergebnisse anzeigen.

Was ist mit Chrome? Es implementiertwindow.open anders als Internet Explorer (11) und Firefox (29).

Ich bin nicht 100% sicher, aber es sieht so aus, als ob Chrome (Version 34.0.1847.131 m) keine Einstellungen zu haben scheint, mit denen der Benutzer auswählen kann, ob Popups in einem neuen Fenster oder auf einer neuen Registerkarte (wie Firefox und Internet Explorer) geöffnet werden sollen oder nicht haben). Ich habe in der Chrome-Dokumentation nachgesehen , ob Popups verwaltet werden sollen , aber es wurde nichts darüber erwähnt.

Auch hier scheinen verschiedene Browser das Verhalten von window.open unterschiedlich zu implementieren . Wenn Sie in Chrome und Firefox eine Breite und Höhe angeben, wird ein Popup erzwungen, selbst wenn ein Benutzer Firefox (29) so eingestellt hat, dass neue Fenster in einem neuen Tab geöffnet werden (wie in den Antworten auf JavaScript in einem neuen Fenster geöffnet, nicht in einem 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>

Mit demselben Codefragment oben wird jedoch immer eine neue Registerkarte in Internet Explorer 11 geöffnet, wenn Benutzer Registerkarten als Browsereinstellungen festlegen. Wenn Sie nicht einmal eine Breite und Höhe angeben, wird ein neues Fenster-Popup für sie erzwungen.

Das Verhalten von window.openin Chrome scheint also darin zu bestehen, Popups in einem neuen Tab zu öffnen, wenn sie in einem onclickEreignis verwendet werden, sie in neuen Fenstern zu öffnen, wenn sie über die Browserkonsole verwendet werden ( wie von anderen Personen angegeben ), und sie in neuen Fenstern zu öffnen, wenn angegeben mit einer Breite und einer Höhe.

Zusammenfassung

Verschiedene Browser implementieren das Verhalten in window.open Bezug auf die Browsereinstellungen der Benutzer unterschiedlich. Sie können nicht erwarten, dass dasselbe Verhalten für window.openalle Bereiche von Internet Explorer, Firefox und Chrome gilt, da die Browsereinstellungen eines Benutzers unterschiedlich behandelt werden.

Zusätzliche Lektüre

Peter Mortensen
quelle
12
Sie haben die Frage nicht beantwortet, sondern nur bewiesen, dass window.open inkonsistent ist.
BentOnCoding
223

Einzeiler:

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

Es erstellt ein virtuelles aElement, gibt es target="_blank"so, dass es in einer neuen Registerkarte geöffnet wird, gibt es richtig url hrefund klickt dann darauf.

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

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

und dann können Sie es verwenden wie:

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

Wichtige Notiz:

openInNewTab(sowie jede andere Lösung auf dieser Seite) muss während des Rückrufs von Benutzeraktionen aufgerufen werden - z. Inside-Click-Ereignis (nicht direkt in der Rückruffunktion erforderlich, sondern während der Klickaktion).

Wenn Sie es in einem zufälligen Moment manuell aufrufen (z. B. innerhalb eines Intervalls oder nach einer Serverantwort), wird es möglicherweise vom Browser blockiert (was sinnvoll ist, da dies ein Sicherheitsrisiko darstellt und zu einer sehr schlechten Benutzererfahrung führen kann )

pie6k
quelle
8
Vielen Dank. Ihr reines JS hat ein fehlendes Teil - wie Luke Alderton schrieb (siehe unten), müssen Sie das erstellte Element an den Dokumentkörper anhängen, in Ihrem Code hängt es in der Leere und zumindest in Firefox 37 tut es nichts .
Greenoldman
4
@mcginniwa Jede Aktion wie diese - wenn sie nicht durch eine Benutzeraktion wie einen Mausklick ausgelöst wird, wird der Popup-Blocker aktiviert. Stellen Sie sich vor, Sie können jede URL mit Javascript ohne Benutzeraktion öffnen - das wäre ziemlich gefährlich. Wenn Sie diesen Code in eine ereignisähnliche Klickfunktion einfügen, funktioniert er einwandfrei. Dies gilt auch für alle hier vorgeschlagenen Lösungen.
Pie6k
4
Sie können Ihren Code wie folgt vereinfachen: $('<a />',{'href': url, 'target', '_blank'}).get(0).click();
Shaedrich
5
@shaedrich inspiriert von Ihrem geschnippten Ich fügte nicht-jquery Einzeiler hinzu:Object.assign(document.createElement('a'), { target: '_blank', href: 'URL_HERE'}).click();
pie6k
In FF funktioniert es nicht!
Nolesh
91

Wenn Sie verwenden window.open(url, '_blank'), wird es in Chrome blockiert (Popup-Blocker).

Versuche dies:

//With JQuery

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

Mit reinem JavaScript

document.querySelector('#myButton').onclick = function() {
    var redirectWindow = window.open('http://google.com', '_blank');
    redirectWindow.location;
};
Mohammed Safeer
quelle
In dieser Frage wird der Autor der Website jedoch nicht erwähnt. Ich möchte nur eine URL in einem neuen Fenster oder einer neuen Registerkarte öffnen. Dies ist browserabhängig. Wir müssen uns nicht um den Autor kümmern. Bitte überprüfen Sie diese Geige. Es funktioniert
Mohammed Safeer
Es wurde festgestellt, dass es bei js Geige und Plunker nicht funktioniert hat, aber beim Erstellen einer HTML-Datei. Es ist, weil js Geige, Ausgabe wird auf iframe angezeigt, so dass neues Fenster wegenthe request was made in a sandboxed frame whose 'allow-popups' permission is not set
Mohammed Safeer
67

Um Steven Spielbergs Antwort zu erläutern, habe ich dies in einem solchen Fall getan:

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

Auf diese Weise setze ich kurz bevor der Browser dem Link folgt, das Zielattribut, sodass der Link in einem neuen Tab oder Fenster geöffnet wird ( abhängig von den Einstellungen des Benutzers ).

Ein Zeilenbeispiel in 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.

Dies kann auch nur mit nativen Browser-DOM-APIs erreicht werden:

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

Ich benutze das folgende und es funktioniert sehr gut!

window.open(url, '_blank').focus();
Ezequiel García
quelle
2
Dies kann je nach Browsereinstellungen in einem neuen Tab oder Fenster geöffnet werden. Die Frage bezieht sich speziell auf das Öffnen in einem neuen Tab, auch wenn die Einstellungen für ein neues Fenster gelten.
Quentin
19

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

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

Dies kann jedoch abhängig von den Browsereinstellungen in einem neuen Tab geöffnet werden:

$.ajax({
    url: "url",
    type: "POST",
    async: false,
    success: function() {
        window.open('url', '_blank');              
    }
});
Karaxuna
quelle
2
Dies wird als Popup in Firefox 28, Chrome 34b und Safari 7.0.2 blockiert, alle Standardeinstellungen. :(
Steve Meisner
1
"Die neue Registerkarte kann nicht geöffnet werden, wenn die Aktion nicht vom Benutzer aufgerufen wird (Klicken auf eine Schaltfläche oder etwas anderes) oder wenn sie asynchron ist" - gilt für Chrome, gilt jedoch nicht für alle Browser. Speichern Sie <script>open('http://google.com')</script>in einer .htmlDatei und öffnen Sie sie in einer Neuinstallation einer aktuellen Version von Firefox. Sie werden feststellen, dass Firefox Google in einem neuen Tab (möglicherweise nachdem Sie Popups zugelassen haben) und nicht in einem neuen Fenster öffnet.
Mark Amery
13

Wenn Sie nur die Parameter [strWindowFeatures] weglassen, wird eine neue Registerkarte geöffnet, es sei denn, die Browsereinstellung überschreibt (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);
MannyC
quelle
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
quelle
11

Sie können einen Trick verwenden mit 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();
}

jsFiddle-Demo

CodeNinja
quelle
4
Wenn Sie diese Methode verwenden, stellen Sie sicher, dass die URL keine Abfrageparameter enthält, da diese beim Senden des Formulars übersprungen werden. Eine Lösung besteht darin, versteckte Eingabeelemente in das Formularelement einzubetten, die nameals Schlüssel und valueals Wert für alle Parameter in Abfrageparametern gelten. Und dann senden Sie das Formular
Mudassir Ali
Dies kann einfacher mit einem aTag anstelle eines Formulars und unter Verwendung der jQuery- .click()Methode zum "Senden" erfolgen. Überprüfen Sie meine Antwort
10

Dies hat nichts mit den Browsereinstellungen zu tun, wenn Sie versuchen, eine neue Registerkarte über eine benutzerdefinierte Funktion zu öffnen.

Öffnen Sie auf dieser Seite eine JavaScript-Konsole und geben Sie Folgendes ein:

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

Außerdem wird versucht, ein Popup unabhängig von Ihren Einstellungen zu öffnen, da der Klick von einer benutzerdefinierten Aktion stammt.

Um sich wie ein tatsächlicher Mausklick auf einen Link zu verhalten, müssen Sie den Ratschlägen von @ spirinvladimir folgen und ihn wirklich erstellen:

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'))));

Hier ist ein vollständiges Beispiel (versuchen Sie es nicht mit jsFiddle oder ähnlichen Online-Editoren, da Sie von dort nicht auf externe Seiten umleiten können):

<!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
quelle
1
Am Ende ging ich zu einer anderen Lösung, wo ich w = window.open("placeholder"); $.ajax(...ajax call that returns the url...) success (...w.location = data.url...)gemäß theandystratton.com/2012/…
Paul Tomblin
11
@FahadAbidJanjua Es ist absolut nicht korrekt. Es hängt immer noch von den Browsereinstellungen ab. In den HTML- oder Javascript-Spezifikationen gibt es nichts, was besagt, dass eine "benutzerdefinierte Aktion" in einem Popup und nicht in einem Tab geöffnet werden muss. In der Tat zeigt keiner der Browser auf meinem aktuellen Computer dieses Verhalten an.
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
quelle
1
Dies kann je nach Browsereinstellungen in einem neuen Tab oder Fenster geöffnet werden. Die Frage bezieht sich speziell auf das Öffnen in einem neuen Tab, auch wenn die Einstellungen für ein neues Fenster gelten.
Quentin
3

JQuery

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

JS

Object.assign(document.createElement('a'), { target: '_blank', href: 'URL_HERE'}).click();
Bryan
quelle
Dies kann je nach Browsereinstellungen in einem neuen Tab oder Fenster geöffnet werden. Die Frage bezieht sich speziell auf das Öffnen in einem neuen Tab, auch wenn die Einstellungen für ein neues Fenster gelten.
Quentin
2

Oder Sie können einfach ein Linkelement erstellen und darauf klicken ...

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);

Dies sollte nicht durch Popup-Blocker blockiert werden ... Hoffentlich.

Luke Alderton
quelle
2

Es gibt eine Antwort auf diese Frage und es ist nicht nein.

Ich fand eine einfache Lösung:

Schritt 1: Erstellen Sie einen unsichtbaren Link:

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

Schritt 2: Klicken Sie programmgesteuert auf diesen Link:

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

Bitte schön! Wirkt ein Zauber für mich.

ALZlper
quelle
Dies kann je nach Browsereinstellungen in einem neuen Tab oder Fenster geöffnet werden. Die Frage bezieht sich speziell auf das Öffnen in einem neuen Tab, auch wenn die Einstellungen für ein neues Fenster gelten.
Quentin
1

Geben Sie hier die Bildbeschreibung ein

Ich habe viele Informationen darüber recherchiert, wie man einen neuen Tab öffnet und auf demselben Tab bleibt. Ich habe einen kleinen Trick gefunden, um es zu tun. Nehmen wir an, Sie haben eine URL, die Sie öffnen müssen - newUrl und alte URL - currentUrl , die Sie nach dem Öffnen des neuen Tabs beibehalten müssen. JS-Code sieht ungefähr so ​​aus:

// 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
quelle
Die Frage betrifft das Öffnen einer neuen Registerkarte, wenn der Benutzer diese in neuen Fenstern öffnen möchte. Es wird nicht gefragt, wie eine URL in einem neuen Tab geöffnet werden soll, während gleichzeitig eine andere URL in dem vorhandenen Tab geöffnet wird.
Quentin
0

Wie wäre es mit dem Erstellen eines <a>with _blankas- targetAttributwerts und des urlas hrefmit Stilanzeige: versteckt mit einem untergeordneten Element? Fügen Sie dann dem DOM hinzu und lösen Sie das Klickereignis für ein untergeordnetes Element aus.

AKTUALISIEREN

Das geht nicht Der Browser verhindert das Standardverhalten. Es könnte programmgesteuert ausgelöst werden, folgt jedoch nicht dem Standardverhalten.

Überzeugen Sie sich selbst: http://jsfiddle.net/4S4ET/

Sieger
quelle
-1

Das Öffnen eines neuen Tabs in einer Firefox (Mozilla) -Erweiterung sieht folgendermaßen aus:

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

Dieser Weg ähnelt der obigen Lösung, ist jedoch anders implementiert

.social_icon -> eine Klasse mit 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
quelle
-1

Dies mag ein Hack sein, aber wenn Sie in Firefox einen dritten Parameter angeben, 'fullscreen = yes', wird ein neues Fenster geöffnet.

Zum Beispiel,

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

Es scheint tatsächlich die Browsereinstellungen zu überschreiben.

Kunal
quelle
-1

Diese Arbeit für mich, verhindern Sie einfach das Ereignis, fügen Sie die URL hinzu <a> tagund lösen Sie dann das Klickereignis darauf aus 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
quelle
Dies kann je nach Browsereinstellungen in einem neuen Tab oder Fenster geöffnet werden. Die Frage bezieht sich speziell auf das Öffnen in einem neuen Tab, auch wenn die Einstellungen für ein neues Fenster gelten.
Quentin
-1

Die window.open(url)URL wird im neuen Browser-Tab geöffnet. Unten JS Alternative dazu

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

Hier ist ein funktionierendes Beispiel (Stackoverflow-Snippets erlauben nicht das Öffnen eines neuen Tabs)

Kamil Kiełczewski
quelle
"Die window.open (URL) öffnet die URL in einem neuen Browser-Tab" - Es folgt der Präferenz des Benutzers für ein neues Fenster oder einen neuen Tab. Es wird keine neue Registerkarte erzwungen, wenn ein Fenster bevorzugt wird. (Worum geht es in der Frage). Gleiches gilt für target = _blank.
Quentin
Beide von Ihnen vorgeschlagenen Ansätze wurden in den vorherigen 56 nicht gelöschten Antworten auf diese Frage mehrfach erwähnt (und kritisiert).
Quentin
-1

Ob die URL in einem neuen Tab oder in einem neuen Fenster geöffnet werden soll, wird tatsächlich von den Browsereinstellungen des Benutzers gesteuert. Es gibt keine Möglichkeit, es in JavaScript zu überschreiben.

window.open()verhält sich je nach Verwendungszweck unterschiedlich. Wenn es als direktes Ergebnis einer Benutzeraktion aufgerufen wird , sagen wir einen Knopfklick, sollte es gut funktionieren und eine neue Registerkarte (oder ein neues Fenster) öffnen:

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

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

Wenn Sie jedoch versuchen, eine neue Registerkarte über einen AJAX-Anforderungsrückruf zu öffnen , blockiert der Browser diese, da es sich um eine direkte Benutzeraktion handelt.

Um den Popup-Blocker zu umgehen und einen neuen Tab in einem Rückruf zu öffnen, ist hier ein kleiner 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
quelle
-1

Ich habe es auf diese Weise versucht und es scheint gut zu funktionieren

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

Ich habe hier viele Arbeitsbeispiele gefunden:

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

Artem Shevtsov
quelle
Dies wird in einem neuen Tab oder Fenster gemäß den Vorlieben des Benutzers geöffnet. Es wird kein neuer Tab erzwungen, um den es in der Frage geht.
Quentin
Haben Sie das bisschen in der Frage verpasst, als das OP das bereits versucht hat? oder stackoverflow.com/a/59565074/19068 ? oder stackoverflow.com/a/35939565/19068 ? oder stackoverflow.com/a/30512485/19068 ? oder stackoverflow.com/a/11384018/19068 ? oder stackoverflow.com/a/26990478/19068 ?
Quentin
@Quentin Ich habe diesen Teil verpasst, aber als ich versuchte, window.open mit dem zweiten Parameter «windowName» gleich «_blank» aufzurufen oder überhaupt nicht, wurde das Popup oder der neue Tab in Google Chrome nicht angezeigt. Als ich den Fensternamen in «newWin» änderte, wurde eine neue Registerkarte geöffnet. Es ist seltsam, weil der Fenstername-Parameter optional ist.
Artem Shevtsov
-4

Ich werde der Person, die geschrieben hat (hier umschrieben), etwas zustimmen: "Bei einem Link auf einer vorhandenen Webseite öffnet der Browser den Link immer in einem neuen Tab, wenn die neue Seite Teil derselben Website ist wie die vorhandene Webseite. " Zumindest für mich funktioniert diese "allgemeine Regel" in Chrome, Firefox, Opera, IE, Safari, SeaMonkey und Konqueror.

Auf jeden Fall gibt es eine weniger komplizierte Möglichkeit, die Vorteile der anderen Person zu nutzen. Angenommen, es handelt sich um Ihre eigene Website ("thissite.com" unten), auf der Sie steuern möchten, was der Browser tut, dann möchten Sie unten, dass "specialpage.htm" leer ist und überhaupt kein HTML darin enthalten ist ( spart Zeit beim Senden von Daten vom 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
quelle
-7

Wenn Sie nur die externen Links (Links zu anderen Websites) öffnen möchten, funktioniert dieses Bit JavaScript / jQuery gut:

$(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
quelle
Diese Antwort ist für diese Frage nicht geeignet. ABER das ist sehr nützlich zu denken! Vielen Dank für Ihre Idee!
Nuri Akman
-9

Der Browser öffnet den Link immer in einem neuen Tab, wenn sich der Link auf derselben Domain (auf derselben Website) befindet. Wenn sich der Link in einer anderen Domäne befindet, wird er abhängig von den Browsereinstellungen in einem neuen Tab / Fenster geöffnet.

Demnach können wir also verwenden:

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

Und fügen Sie etwas jQuery-Code hinzu:

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;
    });
});

Öffnen Sie also zuerst ein neues Fenster auf derselben Website mit dem _blank-Ziel (es wird in einem neuen Tab geöffnet) und öffnen Sie dann die gewünschte Website in diesem neuen Fenster.

loshMiS
quelle