Как открыть ссылку в новом окне?

У меня есть обработчик кликов для конкретной ссылки, внутри которой я хочу сделать что-то похожее на следующее:

window.location = url

Мне нужно это, чтобы действительно открыть URL-адрес в новом окне, но как это сделать?

Ответ 1

Вам может понравиться:

window.open('url', 'window name', 'window settings')

JQuery

$('a#link_id').click(function(){
  window.open('url', 'window name', 'window settings');
  return false;
});

Вы также можете установить target на _blank.

Ответ 2

Здесь, как заставить цель внутри обработчика кликов:

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

Ответ 4

Для этого также можно использовать метод jquery prop().

$(function(){
  $('yourselector').prop('target', '_blank');
}); 

Ответ 5

Что случилось с <a href="myurl.html" target="_blank">My Link</a>? Нет необходимости в Javascript...

Ответ 6

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

Но я пытался захватить клик с диапазоном... поэтому я подумал, почему бы не сделать это, когда я создал span.

var span = $('<span id="something" data-href="'+url+'" />');

Затем я привязал обработчик кликов к диапазону, который создал ссылку на основе атрибута 'data-href':

span.click(function(e) {
    e.stopPropagation();
    var href = $(this).attr('data-href');
    var link = $('<a href="http://' + href + '" />');
    link.attr('target', '_blank');
    window.open(link.attr('href'));
});

Это позволило мне нажать на пробел и открыть новое окно с правильным URL-адресом.

Ответ 7

это решение также рассмотрело случай, когда URL-адрес пуст и отключен (серый) пустая ссылка.

$(function() {
  changeAnchor();
});

function changeAnchor() {
  $("a[name$='aWebsiteUrl']").each(function() { // you can write your selector here
    $(this).css("background", "none");
    $(this).css("font-weight", "normal");

    var url = $(this).attr('href').trim();
    if (url == " " || url == "") { //disable empty link
      $(this).attr("class", "disabled");
      $(this).attr("href", "javascript:void(0)");
    } else {
      $(this).attr("target", "_blank");// HERE set the non-empty links, open in new window
    }
  });
}
a.disabled {
  text-decoration: none;
  pointer-events: none;
  cursor: default;
  color: grey;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<a name="aWebsiteUrl" href="http://www.baidu.com" class='#'>[website]</a>
<a name="aWebsiteUrl" href=" " class='#'>[website]</a>
<a name="aWebsiteUrl" href="http://www.alibaba.com" class='#'>[website]</a>
<a name="aWebsiteUrl" href="http://www.qq.com" class='#'>[website]</a>

Ответ 8

Microsoft IE не поддерживает имя в качестве второго аргумента.

window.open('url', 'window name', 'window settings');

Задача window name. Это будет работать:

window.open('url', '', 'window settings')

Microsoft допускает только следующие аргументы: если использовать этот аргумент вообще:

  • _blank
  • _media
  • _parent
  • _search
  • _self
  • _top

Проверьте этот сайт Microsoft

Ответ 9

Имейте в виду, если вы хотите выполнять запросы AJAX внутри функции обработчика событий для события click. По какой-то причине Chrome (и, возможно, другие браузеры) не откроет новую вкладку/окно.

Ответ 10

Это не очень приятное исправление, но оно работает:

CSS

.new-tab-opener
{
    display: none;
}

HTML:

<a data-href="#" onclick="location.href='http://www.google.com/'; return false;" href="javascript:">Click here</a>
<form class="new-tab-opener" method="get" target="_blank"></form>

JavaScript:

$('a').on('click', function (e) {    
    var f = $('.new-tab-opener');
    f.attr('action', $(this).attr('data-href'));
    f.submit();
});

Пример в реальном времени: http://jsfiddle.net/7eRLb/