web-dev-qa-db-fra.com

Chrome, Javascript, window.open dans un nouvel onglet

Dans chrome cela s'ouvre dans un nouvel onglet:

<button onclick="window.open('newpage.html', '_blank')" />

cela s'ouvre dans une nouvelle fenêtre (mais j'aimerais que ceci s'ouvre également dans un nouvel onglet:

<script language="javascript">
  window.open('newpage.html', '_blank');
</script>

Est-ce faisable?

108
Andrew

Vous ne pouvez pas contrôler cela directement, car c'est une option contrôlée par les utilisateurs d'Internet Explorer.

L'ouverture de pages à l'aide de Window.open avec un nom de fenêtre différent s'ouvrira dans une nouvelle fenêtre du navigateur, telle qu'une fenêtre contextuelle, OR s'ouvrira dans un nouvel onglet, si l'utilisateur a configuré le navigateur pour le faire.

EDIT:

Une explication plus détaillée:

1. Dans les navigateurs modernes, window.open s'ouvrira dans un nouvel onglet plutôt que dans une fenêtre contextuelle.

2. Vous pouvez forcer un navigateur à utiliser une nouvelle fenêtre ("popup") en spécifiant des options dans le 3ème paramètre.

. Si l'appel window.open ne faisait pas partie d'un événement initié par l'utilisateur, il s'ouvrira dans une nouvelle fenêtre.

4. Un "événement initié par l'utilisateur" n'a pas le même appel de fonction - mais il doit provenir de la fonction invoquée par un clic de l'utilisateur

5. Si un événement initié par un utilisateur délègue ou diffère un appel de fonction (dans un écouteur d'événement ou un délégué non lié à l'événement click, ou en utilisant setTimeout par exemple), il perd son statut "initié par l'utilisateur". ”

6. Certains bloqueurs de popup autoriseront les fenêtres ouvertes à partir d'événements déclenchés par l'utilisateur, mais pas celles ouvertes autrement.

7. Si une fenêtre contextuelle est bloquée, celles qui sont normalement autorisées par un bloqueur (via des événements déclenchés par l'utilisateur) seront parfois également bloquées. Quelques exemples…

Forcer une fenêtre à s'ouvrir dans une nouvelle instance de navigateur, au lieu d'un nouvel onglet:

window.open('page.php', '', 'width=1000');

Les éléments suivants sont considérés comme un événement initié par l'utilisateur, même s'il appelle une autre fonction:

function o(){
  window.open('page.php');
}
$('button').addEvent('click', o);

Les éléments suivants ne sont pas considérés comme un événement initié par l'utilisateur, car setTimeout le diffère:

function g(){
  setTimeout(o, 1);
}
function o(){
  window.open('page.php');
}
$('button').addEvent('click', g);
147

Il est parfois utile de forcer l'utilisation d'un onglet, si l'utilisateur le souhaite. Comme Prakash l’a dit plus haut, cela est parfois dicté par l’utilisation d’un événement non déclenché par l’utilisateur, mais il existe des solutions pour y remédier.

Par exemple:

$("#theButton").button().click( function(event) {
   $.post( url, data )
   .always( function( response ) {
      window.open( newurl + response, '_blank' );
   } );
} );

ouvrira toujours "newurl" dans une nouvelle fenêtre de navigateur, car la fonction "toujours" n'est pas considérée comme étant initiée par l'utilisateur. Cependant, si nous faisons cela:

$("#theButton").button().click( function(event) {
   var newtab = window.open( '', '_blank' );
   $.post( url, data )
   .always( function( response ) {
      newtab.location = newurl + response;
   } );
} );

nous ouvrons la nouvelle fenêtre du navigateur ou créons le nouvel onglet, en fonction des préférences de l'utilisateur dans le bouton, cliquez sur lequel IS lancé par l'utilisateur. Ensuite, nous venons de définir l’emplacement sur l’URL souhaitée après le retour de la publication AJAX. Voila, on force l'utilisation d'un onglet si l'utilisateur aime ça.

34
Frank A Tinker

Pour le moment (Chrome 39), j'utilise ce code pour ouvrir un nouvel onglet:

window.open('http://www.stackoverflow.com', '_blank', 'toolbar=yes, location=yes, status=yes, menubar=yes, scrollbars=yes');

Bien sûr, cela pourrait changer dans les futures versions de Chrome.

Il est déconseillé de l'utiliser si vous ne pouvez pas contrôler le navigateur utilisé par vos utilisateurs. Il se peut que cela ne fonctionne pas dans les versions futures ou avec des paramètres différents.

11
Nico Wiedemann

si vous utilisez window.open(url, '_blank'), il sera bloqué (bloqueur de popup) sur Chrome, Firefox, etc.

essaye ça,

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

travailler js violon pour cela http://jsfiddle.net/safeeronline/70kdacL4/2/

travail js fiddle pour la fenêtre ajax ouverte http://jsfiddle.net/safeeronline/70kdacL4/1/

10
Mohammed Safeer

Cela ouvrira le lien dans un nouvel onglet dans Chrome et Firefox, ainsi que sur un plus grand nombre de navigateurs que je n'ai pas testés:

var popup  = $window.open("about:blank", "_blank"); // the about:blank is to please Chrome, and _blank to please Firefox
popup.location = 'newpage.html';

Fondamentalement, il ouvre un nouvel onglet vide, puis définit l'emplacement de cet onglet vide. Attention, c’est une sorte de bidouille, car le comportement des onglets/fenêtres du navigateur est en réalité le domaine, la responsabilité et le choix du navigateur et de l’utilisateur.

La deuxième ligne peut être appelée dans un rappel (après que vous ayez effectué une demande AJAX par exemple), mais le navigateur ne la reconnaîtra pas comme un événement de clic initié par l'utilisateur et risque de bloquer la fenêtre contextuelle. .

6
Magne

Désactivez la mini-solution $('<form action="http://samedomainurl.com/" target="_blank"></form>').submit()

3
Serhii Matrunchyk

Vous pouvez utiliser ce code pour ouvrir dans un nouvel onglet ..

function openWindow( url )
{
  window.open(url, '_blank');
  window.focus();
}

Je l'ai eu de stackoverflow ..

0
Dilip Rajkumar