36 votes

Quelle est la meilleure façon d'ouvrir une nouvelle fenêtre de navigateur?

Je sais que la plupart des liens doit être laissé à l'utilisateur de décider comment l'ouvrir, mais on ne peut pas nier qu'il y a des fois, vous avez presque de force dans une nouvelle fenêtre (par exemple, gérer des données dans un formulaire sur la page en cours).

Ce que je voudrais savoir est ce que le consensus est la meilleure façon pour ouvrir un lien dans une nouvelle fenêtre du navigateur.

Je sais qu' <a href="url" target="_blank"> est sorti. Je sais aussi qu' <a href="#" onclick="window.open(url);"> n'est pas idéal pour une variété de raisons. J'ai aussi essayé de remplacer complètement les ancres avec quelque chose comme <span onclick="window.open(url);"> et puis le style de la DURÉE de ressembler à un lien.

Une solution, je suis penchée vers est - <a href="url" rel="external"> et l'utilisation de JavaScript pour toutes les cibles à '_blank' sur ces ancrages marqué "externes".

Existe-il d'autres idées? Quoi de mieux? Je suis à la recherche pour la plupart conformes à la norme XHTML et facile à faire.

Mise à JOUR: je dis target="_blank" est un non non, parce que j'ai lu à plusieurs endroits que l'attribut cible va être progressivement de XHTML.

37voto

Damir Zekić Points 7517

Je suis l'aide de la dernière méthode que vous avez proposée. - Je ajouter rel="external" ou quelque chose de similaire, puis utiliser jQuery pour itérer sur tous les liens et de leur attribuer un gestionnaire de clic:

$(document).ready(function() {
  $('a[rel*=external]').click(function(){
    window.open($(this).attr('href'));
    return false; 
  });
});

Je trouve ce la meilleure méthode, car:

  • il est évident que, du point de vue sémantique: vous avez un lien vers une ressource externe
  • il est conforme aux normes
  • il se dégrade gracieusement (vous avez un très simple lien régulier href d'attribut)
  • elle permet tout de même de l'utilisateur au moyen-cliquez sur le lien et ouvrir dans un nouvel onglet s'ils le souhaitent

13voto

Luk Points 2602

Pourquoi target = "_ blank" est-il une mauvaise idée?

C'est censé faire exactement ce que vous voulez.

modifier: (voir les commentaires) point pris, mais je pense que l'utilisation de javascript pour effectuer une telle tâche peut être assez dérangeante (ceux qui cliquent au milieu pour ouvrir une nouvelle fenêtre par habitude, et ceux qui utilisent une extension NoScript )

11voto

Mnementh Points 19831

S'il vous plaît, ne pas forcer l'ouverture d'un lien dans une nouvelle fenêtre.

Les raisons qui militent contre elle:

  • Il viole la règle du moins l'étonnement.
  • Le dos-bouton ne fonctionne pas et l'utilisateur ne peut en connaît la raison.
  • Ce qui se passe dans les onglets des navigateurs? Nouvel onglet ou une nouvelle fenêtre? Et selon ce qui se produit, c'est ce que tu veut, si vous mélangez les onglets et les fenêtres?

La raison pour laquelle j'entends toujours en faveur de l'ouverture d'une nouvelle fenêtre, c'est que l'utilisateur ne va pas quitter le site. Mais assurez-vous, je ne vais jamais revenir à un site qui m'agace. Et si le site prend de suite le contrôle de moi, c'est un grand ennui.

D'une manière peut-être, que vous donner deux liens, l'un est normal, l'autre s'ouvre dans une nouvelle fenêtre. Ajouter la deuxième avec un petit symbole après le lien normal. De cette façon, les utilisateurs de votre site à garder le contrôle de qui lien qu'ils veulent, cliquez sur.

5voto

alex Points 186293

Voici un plugin que j'ai écrit pour jQuery

  (function($){  
  $.fn.newWindow = function(options) {       
    var defaults = {
        titleText: 'Link opens in a new window'     
    };

     options = $.extend(defaults, options);

     return this.each(function() {  
       var obj = $(this);

       if (options.titleText) {        
           if (obj.attr('title')) {
                     var newTitle = obj.attr('title') + ' (' 
                                                + options.titleText + ')';
           } else {
                    var newTitle = options.titleText;
           };              
           obj.attr('title', newTitle);            
       };          

       obj.click(function(event) {
          event.preventDefault();  
          var newBlankWindow = window.open(obj.attr('href'), '_blank');
          newBlankWindow.focus();
        });     
       });    
  };  
 })(jQuery); 
 

Exemple d'utilisation

 $('a[rel=external]').newWindow();
 

Vous pouvez également modifier ou supprimer le titre en transmettant certaines options.

Exemple pour changer le texte du titre:

 $('a[rel=external]').newWindow( { titleText: 'This is a new window link!' } );
 

Exemple pour le supprimer complètement

 $('a[rel=external]').newWindow( { titleText: '' } );
 

2voto

BoboTheCodeMonkey Points 628

Je ne comprends peut-être pas quelque chose, mais pourquoi ne voulez-vous pas utiliser target = "_ blank"? C'est comme ça que je le ferais. Si vous recherchez le logiciel le plus compatible, toute sorte de JavaScript disparaîtrait, car vous ne pouvez pas être sûr que JS est activé sur le client.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X