Como clico programaticamente em um link com javascript?

173

Existe uma maneira de clicar em um link na minha página usando JavaScript?

javascript hyperlink click anchor Mahdi Alkhatib
fonte
6
Você pode executar apenas um 'clique' nos elementos input type = "button".
Ballsacian1
@ Ballsacian1 Eu usei .click()em um <a>elemento e funcionou.
PaulMag 08/08/19

Respostas:

237 
document.getElementById('yourLinkID').click();
arik
fonte
18
Na verdade, até agora funcionou em todos os navegadores que tentei, incluindo IE, Safari, Chrome, Firefox e Opera.
Arik
5
Observe que, se o link a tiver target="_blank"propriedade, o bloqueador de pop-up do navegador será ativado para a nova janela.
wonsuc
45

Esta função funciona pelo menos no Firefox e no Internet Explorer. Ele executa todos os manipuladores de eventos anexados ao link e carrega a página vinculada se os manipuladores de eventos não cancelarem a ação padrão.

function clickLink(link) {
    var cancelled = false;

    if (document.createEvent) {
        var event = document.createEvent("MouseEvents");
        event.initMouseEvent("click", true, true, window,
            0, 0, 0, 0, 0,
            false, false, false, false,
            0, null);
        cancelled = !link.dispatchEvent(event);
    }
    else if (link.fireEvent) {
        cancelled = !link.fireEvent("onclick");
    }

    if (!cancelled) {
        window.location = link.href;
    }
}
Matthew Crumley
fonte
5
Matthew está correto e o stackoverflow.com/questions/809057/… tem mais algumas informações sobre o porquê. Cross browser é divertido :)
Dan F
4
não respeita o targetatributo ou<base target="frame">
Vitim.us 9/11/2015
38

Se você deseja alterar apenas o endereço da página atual, basta fazer isso em Javascript:

location.href = "http://www.example.com/test";
Fabien Ménager
fonte
53
Votado, porque não gosto de respostas que respondam ao caso de uso, em vez de tratá-lo. "Presumo que essa seja sua intenção e não conheço suas restrições, portanto, com uma esfera conceitual em um vácuo conceitual: use isso".
Cazlab
11
Votei, porque estava procurando uma boa solução para clicar mailto:no link no script userjs. Definitivamente me salvou tempo. Eu estava preparado para criar aelemento e fazer algum "clique programático" stackoverflow.com/questions/809057/...
AD
6
Eu também tentei chamar o click()método proposto em outros lugares e acima e ele não funcionou no IE9, mas a configuração location.hrefrealmente enviou o email a partir do mailto:link. Ótima solução!
ajeh
Este método foi útil no PyQT4. a chamada click () não estava funcionando para mim. Obrigado!
VilleLipponen
Não aborda meu caso de uso que está na pergunta, onde desejo clicar em um link. O link não leva a lugar algum, mas tem outras coisas vinculadas ao evento de clique. Não quero mudar de local.
Random Elephant
17

Simplesmente assim: 

<a id="myLink" onclick="alert('link click');">LINK 1</a>
<a id="myLink2" onclick="document.getElementById('myLink').click()">Click link 1</a>

ou no carregamento da página: 

<body onload="document.getElementById('myLink').click()">
...
<a id="myLink" onclick="alert('link click');">LINK 1</a>
...
</body>
Canavar
fonte
2
Sim, mas outro clique deve acontecer.
Ólafur Waage
2
Você não pode fazer isso em nenhum evento, como o carregamento da página?
Bill Bill Lizard
2
obrigado pela ajuda, mas im usando o firefox 3 e ele não funciona, no console de erro diz erro: document.getElementById ( "myLink") clique não é uma função.
Parece que o Firefox não suporta o método de clique. e a maioria das respostas, incluindo o meu, não são úteis :)
Canavar
@Canavar: Experimente clicar em vez de clicar #
Stefan Steiger
9

A maneira do jQuery de clicar em um link é

$('#LinkID').click();

Para o link mailTo, você deve escrever o seguinte código

$('#LinkID')[0].click();
Muhammad Waqas Iqbal
fonte
2
Isso não funciona. Esta não é a resposta para a pergunta que ele fez. Eu daria um negativo para isso se eu tivesse mais alguns pontos.
2
Isso não funciona? Você já tentou? Espero que você entenda o que "LinkID" significa. Eu ficaria realmente surpreso se alguém hoje em dia estiver atrasado o suficiente para js sem jQuery. De qualquer forma, se sentir livre para downvote depois de ganhar alguns pontos
Muhammad Waqas Iqbal
3
Eu tentei isso e o link mailTo não funciona no React Native. Use isto: window.location.href = "mailto: [email protected]";
Fungusanthrax 10/03
4
Isso não funcionou para mim ao clicar em um alink. Usar a [0].click()versão funciona, que acredito ser a mesma que a document.getElementById('yourLinkID').click();resposta.
Mmm
Navegador Firefox: Isso funciona para <input>, mas não para um <a>
jimver04
2

Para mim, eu consegui fazer as coisas funcionarem dessa maneira. Implantei o clique automático em 5000 milissegundos e fechei o loop após 1000 milissegundos. Depois, houve apenas 1 clique automático.

<script> var myVar = setInterval(function ({document.getElementById("test").click();}, 500); setInterval(function () {clearInterval(myVar)}, 1000); </script>
Naiguel Developer
fonte
2

Muitos dos métodos acima foram preteridos. Agora é recomendado usar o construtor encontrado aqui

function clickAnchorTag() {
    var event = document.createEvent('MouseEvent');
    event = new CustomEvent('click');
    var a = document.getElementById('nameOfID');
    a.dispatchEvent(event);
}

Isso fará com que a tag âncora seja clicada, mas não mostrará se os bloqueadores de pop-up estão ativos, portanto o usuário precisará permitir pop-ups.

maus
fonte
3
Não entendo por que o evento está sendo definido duas vezes. Não vejo como event = new CustomEvent ('clique'); é um evento de referência, então, qual é o ponto de var ... #
93819
Eu acho que você está correto. Ele está criando um evento de mouse e imediatamente o substitui por um novo evento.
John Lord
1

Em vez de clicar, você pode encaminhar para o URL que o clique utilizaria no Javascript?

Talvez você possa colocar algo no corpo no Load para ir para onde quiser.

Jas Panesar
fonte
Postei nas duas perguntas porque as pessoas não procuram naturalmente as informações dos botões quando estão lidando com um link "uma tag". Eles são tecnicamente independentes.
Scott Tovey
1

Você pode apenas redirecioná-los para outra página. Na verdade, fazê-lo literalmente clicar em um link e viajar até ele parece desagradável, mas não conheço a história toda.

akway
fonte
2
No meu caso, não sei se o link tem o destino "_blank"; portanto, não sei se devo usar location.href ou window.open. É mais curto enviar um clique. Existem casos de uso, por exemplo, você pode disparar um evento como abrir um modalbox.
Dxvargas 4/17
-2

Você não pode fazer o mouse do usuário fazer nada. Mas você tem controle total sobre o que acontece quando um evento é acionado.

O que você pode fazer é clicar na carga corporal. O W3Schools tem um exemplo aqui.

Ólafur Waage
fonte
6
@ Neolit, era um link ruim antes de obter 404, de qualquer maneira. Sem perda.
John Dvorak
-2

Função JS do lado do cliente para clicar automaticamente em um link quando ...

Aqui está um exemplo em que você verifica o valor de uma entrada de formulário oculta, que retém um erro transmitido pelo servidor. O JS do lado do cliente verifica o valor e preenche um erro em outro local que você especificar .. caso um modal de login pop-up.

var signUperror = document.getElementById('handleError')

if (signUperror) {
  if(signUperror.innerHTML != ""){
  var clicker = function(){
    document.getElementById('signup').click()
  }
  clicker()
  }
}
Vontei
fonte