Как смоделировать target = «_ blank» в JavaScript

156

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

<body onLoad="document.getElementById('redirect').click">
<a href="http://www.mydomain.com?ReportID=1" id="redirect" target="_blank">Report</a>
</body>
Филипп Сенн
источник
1
Хм? target="_top"не открывается в новом окне - target="_blank"делает.
Томалак
Если ссылка уже открывается в новом окне (из-за target = "_ blank") и обработчик кликов javascript уже обновляет вашу базу данных, зачем вам вообще нужно открывать новое окно с Javascript?
Джоэл Мюллер

Ответы:

298
<script>
    window.open('http://www.example.com?ReportID=1', '_blank');
</script>

Второй параметр является необязательным и является именем целевого окна.

ChristopheD
источник
2
window.openделает то, что target="_blank"делает - он открывает URL в новом окне.
ceejayoz
3
да. Второй аргумент window.open () - это имя, которое вы хотите дать окну, аналогично установке цели для ссылки. developer.mozilla.org/En/DOM:window.open
Омер Бохари
2
О, я вижу. window.open заблокирован блокировщиком всплывающих окон Firefox, но target = "_ blank" нет. Должен ли я просто попросить клиента включить всплывающие окна со своего веб-сайта?
Филипп Сенн
7
Есть ли решение JavaScript, которое не блокируется всплывающими окнами, такими как Firefox?
ma11hew28
4
@MattDiPasquale блокировка window.open - своего рода точка блокирования всплывающих окон! Если вы делаете вызов в ответ на действие щелчка, у него больше шансов не быть заблокированным.
Уильям Денисс
19

Это может помочь

var link = document.createElementNS("http://www.w3.org/1999/xhtml", "a");
    link.href = 'http://www.google.com';
    link.target = '_blank';
    var event = new MouseEvent('click', {
        'view': window,
        'bubbles': false,
        'cancelable': true
    });
    link.dispatchEvent(event);
Jair Reina
источник
IE11: «Ошибка Javascript во время выполнения: недопустимое действие для объекта»
T-moty
8
Этот ответ может быть улучшен добавлением некоторого описания происходящего
сообщение Элли
13

Я знаю, что сделка окончена, но вот что я использую для решения проблемы в моем приложении.

if (!e.target.hasAttribute("target")) {
    e.preventDefault();     
    e.target.setAttribute("target", "_blank");
    e.target.click();
    return;
}

В основном, что здесь происходит, я запускаю проверку, если ссылка имеет target=_blankатрибут. Если это не так, он останавливает запуск ссылки, настраивает ее на открытие в новом окне и затем программно нажимает на нее.

Вы можете сделать еще один шаг и пропустить остановку исходного клика (и сделать свой код намного более компактным), попробовав это:

if (!e.target.hasAttribute("target")) {
    e.target.setAttribute("target", "_blank");
}

Если вы использовали jQuery для абстрагирования от реализации добавления кросс-браузера атрибутов, вы должны использовать это вместо e.target.setAttribute("target", "_blank"):

    jQuery(event.target).attr("target", "_blank")

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

Вот демонстрация этого в действии для вас возиться.

(Ссылка в jsfiddle возвращается к этому обсуждению .. новая вкладка не нужна :))

akamaozu
источник
1
Я предпочитаю этот ответ всем, потому что он использует jquery и избегает проблем блокировщика всплывающих окон window.open. Это вполне законно при работе с данными третьих сторон, которые содержат ссылки, которые не соответствуют цели.
IncredibleHat
7

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

onclick="this.target='_blank';"

Я начал использовать это, чтобы обойти строгий тест W3C XHTML.

Зеннет Фукс
источник
1
Я думаю, что встроенный JavaScript более беспорядочный, чем добавление «нестандартного» атрибута, который работает везде.
Матти Вирккунен
@MattiVirkkunen в некоторых ситуациях это единственное решение
Клавдиу Крянгэ
1
@Claudiu: Если вы окажетесь в такой абсурдной ситуации, вам следует скорее устранить причину, чем разбивать ее вокруг.
Матти Вирккунен
5

Вот как я делаю это с помощью jQuery. У меня есть класс для каждой ссылки, которую я хочу открыть в новом окне.

$(function(){

    $(".external").click(function(e) {
        e.preventDefault();
        window.open(this.href);
    });
});
Джиндра Хелкл
источник
2

Вы можете извлечь href из тега a:

window.open(document.getElementById('redirect').href);
treznik
источник
1

Это может помочь вам открыть все ссылки на страницы :

$(".myClass").each(
     function(i,e){
        window.open(e, '_blank');
     }
);

Он откроет все <a href="" class="myClass"></a>элементы ссылки на другую вкладку, как если бы вы щелкнули по каждой из них.

Вам нужно только вставить его в консоль браузера. требуется структура jQuery

radacina
источник