Como simular target = "_ blank" em JavaScript

156

Quando um usuário clica em um link, preciso atualizar um campo em um banco de dados e abrir o link solicitado em uma nova janela. A atualização não é problema, mas não sei como abrir uma nova janela sem exigir que eles cliquem em outro hiperlink.

<body onLoad="document.getElementById('redirect').click">
<a href="http://www.mydomain.com?ReportID=1" id="redirect" target="_blank">Report</a>
</body>
javascript Phillip Senn
fonte
1
Hum? target="_top"não abre em uma nova janela - target="_blank"faz.
Tomalak
Se o link já estiver sendo aberto em uma nova janela (devido a target = "_ blank") e o manipulador de javascript já estiver atualizando seu banco de dados, por que você precisaria abrir a nova janela com Javascript?
Joel Mueller

Respostas:

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

O segundo parâmetro é opcional e é o nome da janela de destino.

ChristopheD
fonte
2
window.openfaz o que target="_blank"faz - abre o URL em uma nova janela.
ceejayoz
3
sim. o segundo argumento para window.open () é o "nome" que você deseja fornecer à janela, semelhante a definir um destino em um link. developer.mozilla.org/En/DOM:window.open
Omer Bokhari
2
Ah eu vejo. window.open está bloqueado pelo bloqueador de pop-ups do Firefox, mas target = "_ blank" não está. Devo apenas pedir ao cliente para ativar pop-ups em seu próprio site?
Phillip Senn
7
Existe uma solução JavaScript que não seja bloqueada por bloqueadores de pop-up como o do Firefox?
ma11hew28
4
O bloqueio de @MattDiPasquale window.open é meio que o ponto de bloqueadores de pop-up! Se você fizer a chamada em resposta a uma ação de clique, ela terá mais chances de não ser bloqueada.
precisa saber é o seguinte
19

Isso pode ajudar

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
fonte
IE11: "Erro Runtime Javascript: não é uma ação válida para o objeto"
T-MOTY
8
Esta resposta pode ser melhorada adicionando-se uma descrição do que está acontecendo.
Elly Post
13

Sei que este é um acordo feito e resolvido, mas eis o que estou usando para resolver o problema no meu aplicativo.

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

Basicamente, o que está acontecendo aqui é que eu corro para verificar se o link tem target=_blankatributo. Caso contrário, ele interrompe o acionamento do link, configura-o para abrir em uma nova janela e clica programaticamente nele.

Você pode dar um passo adiante e pular a parada do clique original (e tornar seu código muito mais compacto) ao tentar o seguinte:

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

Se você estava usando o jQuery para abstrair a implementação da adição de um atributo entre navegadores, use isso em vez de e.target.setAttribute("target", "_blank"):

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

Pode ser necessário retrabalhá-lo para se adequar ao seu caso de uso exato, mas eis como eu arranhei minha própria coceira.

Aqui está uma demonstração em ação para você mexer.

(O link no jsfiddle volta a esta discussão. Não é necessária uma nova guia :))

akamaozu
fonte
1
Prefiro essa resposta acima de tudo porque, bem, ela usa jquery e evita os problemas do bloqueador de janelas window.open. Isso é perfeitamente legítimo ao lidar com alguns dados de terceiros que contêm links que estão faltando no destino.
IncredibleHat
7

Pessoalmente, prefiro usar o código a seguir, se for para um único link. Caso contrário, provavelmente é melhor se você criar uma função com código semelhante.

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

Comecei a usá-lo para contornar o teste estrito XHTML do W3C.

Zennethe Fuchs
fonte
1
Acho que o JavaScript embutido é mais confuso do que adicionar um atributo "não padrão" que funciona em qualquer lugar.
Matti Virkkunen
@MattiVirkkunen em determinadas situações, é a única solução
Claudiu Creanga
1
@ Claudiu: Se você se encontra em uma situação tão absurda, prefere consertar a causa do que reclamar.
Matti Virkkunen
5

É assim que faço com o jQuery. Eu tenho uma classe para cada link que eu quero que seja aberto em uma nova janela.

$(function(){

    $(".external").click(function(e) {
        e.preventDefault();
        window.open(this.href);
    });
});
Jindra Helcl
fonte
2

Você pode extrair o href da marca a:

window.open(document.getElementById('redirect').href);
treznik
fonte
1

Isso pode ajudá-lo a abrir todos os links da página :

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

Ele abrirá todos os <a href="" class="myClass"></a>itens de link para outra guia, como se você tivesse clicado em cada um.

Você só precisa colá-lo no console do navegador. estrutura jQuery necessária

radacina
fonte