Какой лучший способ открыть новое окно браузера? - PullRequest
36 голосов
/ 24 октября 2008

Я знаю, что большинство ссылок должно быть оставлено на усмотрение конечного пользователя, чтобы решить, как открыть, но мы не можем отрицать, что бывают случаи, когда вам почти «приходится» принудительно открывать новое окно (например, для сохранения данных в форме на текущей странице).

Что я хотел бы знать, так это то, каково единодушное мнение о «лучшем» способе открыть ссылку в новом окне браузера.

Я знаю, что <a href="url" target="_blank"> отсутствует. Я также знаю, что <a href="#" onclick="window.open(url);"> не идеален по разным причинам. Я также попытался полностью заменить якоря чем-то вроде <span onclick="window.open(url);">, а затем стилизовать SPAN, чтобы он выглядел как ссылка.

Одним из решений, к которому я склоняюсь, является <a href="url" rel="external"> и использование JavaScript для установки всех целей на «_blank» для тех якорей, помеченных как «внешние».

Есть еще идеи? Что лучше? Я ищу самый XHTML-совместимый и самый простой способ сделать это.

ОБНОВЛЕНИЕ: я говорю target = "_ blank" - это нет, нет, потому что я прочитал в нескольких местах , что целевой атрибут будет исключен из XHTML.

Ответы [ 10 ]

37 голосов
/ 24 октября 2008

Я использую последний предложенный вами метод. Я добавляю rel = "external" или что-то подобное, а затем использую jQuery, чтобы перебрать все ссылки и назначить им обработчик кликов:

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

Я считаю этот метод лучшим, потому что:

  • это очень понятно семантически: у вас есть ссылка на внешний ресурс
  • соответствует стандартам
  • изящно ухудшается (у вас очень простая ссылка с обычным атрибутом href)
  • он по-прежнему позволяет пользователю щелкнуть средней кнопкой мыши по ссылке и открыть ее на новой вкладке, если он пожелает
13 голосов
/ 24 октября 2008

Почему target="_blank" плохая идея?

Он должен делать именно то, что вы хотите.

edit: (см. Комментарии) точка взята, но я думаю, что использование javascript для выполнения такой задачи может привести к тому, что некоторые люди будут очень расстроены (те, кто щелкает по среднему клику, чтобы открыть новое окно по привычке, и те, кто расширение NoScript)

11 голосов
/ 25 октября 2008

Пожалуйста, не заставляйте открывать ссылку в новом окне.

Причины против этого:

  • Это нарушает правило наименьшего удивления.
  • Кнопка "Назад" не работает, и пользователь не знает, почему.
  • Что происходит в браузерах с вкладками? Новая вкладка или новое окно? И что бы ни случилось, это то, что вы хотите, если вы смешиваете вкладки и окна?

Причина, по которой я всегда слышу в пользу открытия нового окна, заключается в том, что пользователь не покинет сайт. Но будь уверен, я никогда не вернусь на сайт, который меня раздражает. И если сайт отнимает у меня контроль, это очень раздражает.

Возможно, вы дадите две ссылки: одна нормальная, другая откроет ее в новом окне. Добавьте второе с небольшим символом после обычной ссылки. Таким образом, пользователи вашего сайта смогут контролировать, по какой ссылке они хотят щелкнуть.

5 голосов
/ 10 июля 2009

Вот плагин, который я написал для 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); 

Пример использования

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

Вы также можете изменить или удалить текст заголовка, передав некоторые параметры

Пример изменения текста заголовка:

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

Пример полного удаления

$('a[rel=external]').newWindow( { titleText: '' } );
2 голосов
/ 25 октября 2008
<a href="http://some.website.com/" onclick="return !window.open( this.href );">link text</a>

Подробности описаны в моем ответе на другой вопрос .

2 голосов
/ 24 октября 2008

Возможно, я что-то неправильно понимаю, но почему вы не хотите использовать target = "_ blank"? Вот так я бы это сделал. Если вы ищете наиболее совместимую версию, то вам не нужен JavaScript, так как вы не уверены, что на клиенте включен JS.

1 голос
/ 24 октября 2008
<a href="http://www.google.com" onclick="window.open(this.href); return false">

Это все равно откроет ссылку (хотя и в том же окне), если у пользователя отключен JS. В противном случае он работает точно так же, как target = blank, и его легко использовать, поскольку вам просто нужно добавить функцию onclick (возможно, с помощью JQuery) ко всем обычным тегам.

0 голосов
/ 30 июля 2010

Я пользуюсь этим ...

$(function() {
  $("a:not([href^='"+window.location.hostname+"'])").click(function(){
    window.open(this.href);
    return false;
  }).attr("title", "Opens in a new window");
});
0 голосов
/ 24 октября 2008

Если я на странице формы и, например, щелкнув ссылку moreinfo.html, я потеряю данные, если я не открою их в новой вкладке / окне, просто скажите мне.

Вы можете обмануть меня, чтобы открыть новую вкладку / окно с помощью window.open () или target = "_ blank", но у меня могут быть отключены цели и всплывающие окна. Если JS, цели и всплывающие окна необходимы, чтобы вы обманули меня при открытии нового окна / вкладки, сообщите мне, прежде чем я начну заполнять форму.

Или сделайте ссылки на другую страницу запросом формы, чтобы при отправке посетителем данные текущей формы сохранялись, чтобы они могли продолжаться с прошлого раза, если это возможно.

0 голосов
/ 24 октября 2008

Если вы используете какой-либо вариант со строгим форматом документа или ближайшие настоящие xhtml-варианты, цель не разрешается ...

Используя переходный тип HTML4.01 или XHTML1, вы можете использовать решение Damirs, хотя оно не может реализовать свойство windowName, которое необходимо в window.open ():

В формате HTML:

<a href="..." target="_blank" onclick="window.open(this.href, 'newWin'); return false;">link</a>

Если, однако, вы используете один из строгих типов документов, ваш единственный способ открыть ссылки - использовать это решение без атрибута target ...

- кстати, число не-js-браузеров часто просчитывается, поиск номеров счетчиков ссылается на очень разные числа, и мне интересно, сколько из этих не-js-браузеров является сканерами и тому подобное ! -)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...