Откройте URL в новой вкладке (а не в новом окне), используя JavaScript - PullRequest
Новая
       119

Откройте URL в новой вкладке (а не в новом окне), используя JavaScript

1837 голосов
/ 05 февраля 2011

Я пытаюсь открыть URL в новой вкладке, в отличие от всплывающего окна.

Я видел похожие вопросы, где ответы выглядели бы примерно так: 

window.open(url,'_blank');
window.open(url);

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

Ответы [ 26 ]

13 голосов
/ 18 ноября 2014

Просто опуская параметры [strWindowFeatures], вы откроете новую вкладку, ЕСЛИ БЕЗ переопределения настроек браузера (настройка браузера превосходит JavaScript).

Новое окно 

var myWin = window.open(strUrl, strWindowName, [strWindowFeatures]);

Новая вкладка 

var myWin = window.open(strUrl, strWindowName);

- или - 

var myWin = window.open(strUrl);
11 голосов
/ 19 октября 2013 
(function(a){
document.body.appendChild(a);
a.setAttribute('href', location.href);
a.dispatchEvent((function(e){
    e.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, true, false, false, false, 0, null);
    return e
}(document.createEvent('MouseEvents'))))}(document.createElement('a')))
11 голосов
/ 20 января 2016

Вы можете использовать трюк с form: 

$(function () {
    $('#btn').click(function () {
        openNewTab("http://stackoverflow.com")
        return false;
    });
});

function openNewTab(link) {
    var frm = $('<form   method="get" action="' + link + '" target="_blank"></form>')
    $("body").append(frm);
    frm.submit().remove();
}

jsFiddle demo

10 голосов
/ 22 ноября 2013

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

На этой странице откройте консоль JavaScript и введите: 

document.getElementById("nav-questions").setAttribute("target", "_blank");
document.getElementById("nav-questions").click();

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

Чтобы вести себя как настоящий «щелчок мышью» по ссылке, вам нужно следовать @ spirinvladimir советам и действительно создать его: 

document.getElementById("nav-questions").setAttribute("target", "_blank");
document.getElementById("nav-questions").dispatchEvent((function(e){
  e.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0,
                    false, false, false, false, 0, null);
  return e
}(document.createEvent('MouseEvents'))));

Вот полный пример (не пробуйте его на jsFiddle или аналогичных онлайн-редакторах, поскольку он не позволит вам перенаправлять на внешние страницы оттуда): 

<!DOCTYPE html>
<html>
<head>
  <style>
    #firing_div {
      margin-top: 15px;
      width: 250px;
      border: 1px solid blue;
      text-align: center;
    }
  </style>
</head>
<body>
  <a id="my_link" href="http://www.google.com"> Go to Google </a>
  <div id="firing_div"> Click me to trigger custom click </div>
</body>
<script>
  function fire_custom_click() {
    alert("firing click!");
    document.getElementById("my_link").dispatchEvent((function(e){
      e.initMouseEvent("click", true, true, window, /* type, canBubble, cancelable, view */
            0, 0, 0, 0, 0,              /* detail, screenX, screenY, clientX, clientY */
            false, false, false, false, /* ctrlKey, altKey, shiftKey, metaKey */
            0, null);                   /* button, relatedTarget */
      return e
    }(document.createEvent('MouseEvents'))));
  }
  document.getElementById("firing_div").onclick = fire_custom_click;
</script>
</html>
3 голосов
/ 06 ноября 2013

Или вы можете просто создать элемент ссылки и щелкнуть по нему ... 

var evLink = document.createElement('a');
evLink.href = 'http://' + strUrl;
evLink.target = '_blank';
document.body.appendChild(evLink);
evLink.click();
// Now delete it
evLink.parentNode.removeChild(evLink);

Это не должно блокироваться любыми блокировщиками всплывающих окон ... Надеемся.

2 голосов
/ 21 сентября 2018

На этот вопрос есть ответ, и его нет.

Я нашел простое решение:

Шаг 1. Создайте невидимую ссылку:

<a id="yourId" href="yourlink.html" target="_blank" style="display: none;"></a>

Шаг 2: Нажмите на эту ссылку программно:

document.getElementById("yourId").click();

Вот, пожалуйста! Создает для меня заклинание.

1 голос
/ 26 мая 2018

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

$ (your_element_here) .prop ('target', '_blank');

0 голосов
/ 22 июня 2014

Я собираюсь несколько согласиться с человеком, который написал (перефразировал здесь): «Для ссылки на существующей веб-странице браузер всегда будет открывать ссылку в новой вкладке, если новая страница является частью той же самойвеб-сайт как существующая веб-страница. "По крайней мере, для меня это «общее правило» работает в Chrome, Firefox, Opera, IE, Safari, SeaMonkey и Konqueror.

В любом случае, есть менее сложный способ воспользоваться преимуществами того, что другой человекпредставил.Предположим, что мы говорим о вашем собственном веб-сайте («thissite.com» ниже), где вы хотите контролировать действия браузера, а затем, ниже, вы хотите, чтобы «specialpage.htm» был ПУСТОЙ, без HTML вообще (экономит время отправки данных с сервера!). 

 var wnd, URL;  //global variables

 //specifying "_blank" in window.open() is SUPPOSED to keep the new page from replacing the existing page
 wnd = window.open("http://www.thissite.com/specialpage.htm", "_blank"); //get reference to just-opened page
 //if the "general rule" above is true, a new tab should have been opened.
 URL = "http://www.someothersite.com/desiredpage.htm";  //ultimate destination
 setTimeout(gotoURL(),200);  //wait 1/5 of a second; give browser time to create tab/window for empty page


 function gotoURL()
 { wnd.open(URL, "_self");  //replace the blank page, in the tab, with the desired page
   wnd.focus();             //when browser not set to automatically show newly-opened page, this MAY work
 }
0 голосов
/ 02 ноября 2017

это работает для меня, просто предотвратите событие, добавьте URL к <a> tag, затем запустите событие щелчка на этом tag. 

Js
$('.myBtn').on('click', function(event) {
        event.preventDefault();
        $(this).attr('href',"http://someurl.com");
        $(this).trigger('click');
});
HTML
<a href="#" class="myBtn" target="_blank">Go</a>
0 голосов
/ 24 августа 2013

Если вы хотите открыть только внешние ссылки (ссылки, которые ведут на другие сайты), тогда этот кусочек JavaScript / jQuery хорошо работает: 

$(function(){
    var hostname = window.location.hostname.replace('www.', '');
    $('a').each(function(){
        var link_host = $(this).attr('hostname').replace('www.', '');
        if (link_host !== hostname) {
            $(this).attr('target', '_blank');
        }
    });
});
Страница:
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...