Каков наилучший способ открыть новое окно браузера?

Question

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

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

Я знаю, что <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" - нет, потому что я прочитал в several places, что целевой атрибут будет удален из XHTML.

Answer 1

Я использую последний предложенный метод. Добавить отн = «внешний» или что-то подобное, а затем использовать JQuery для перебора всех ссылок и назначить им обработчик щелчка:

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

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

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

Answer 2

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

Предполагается сделать именно то, что вы хотите.

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

Answer 3

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

Answer 4

<a href="http://www.google.com" onclick="window.open(this.href); return false"> 

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

Answer 5

Если вы используете любой вкус строгого DOCTYPE или ближайшие реальные Xhtml привкусов, цель не допускаются ...

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

В простом HTML:

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

Однако, если вы используете один из строгие доктриты, ваш единственный способ открытия ссылок - использовать это решение без целевого атрибута ...

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

Answer 6

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

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

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

Answer 7

<a href="http://some.website.com/" onclick="return !window.open(this.href);">link text</a> 

Детали описаны в моем answer to another question.

Answer 8

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

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

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

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

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

Answer 9

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

Пример удалить его ALLtogether

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

Answer 10

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

$(function() { 
    $("a:not([href^='"+window.location.hostname+"'])").click(function(){ 
    window.open(this.href); 
    return false; 
    }).attr("title", "Opens in a new window"); 
});