Wie klicke ich programmgesteuert auf einen Link mit Javascript?

173

Gibt es eine Möglichkeit, mit JavaScript auf einen Link auf meiner Seite zu klicken?

javascript hyperlink click anchor Mahdi Alkhatib
quelle
6
Sie können nur einen Klick auf Elemente vom Typ input type = "button" ausführen.
Ballsacian1
@ Ballsacian1 Ich habe .click()ein <a>Element verwendet und es hat funktioniert.
PaulMag

Antworten:

237 
document.getElementById('yourLinkID').click();
arik
quelle
18
Bisher funktionierte es in allen Browsern, die ich ausprobiert habe, einschließlich IE, Safari, Chrome, Firefox und Opera.
Arik
5
Beachten Sie, dass target="_blank"der Popup-Blocker des Browsers für das neue Fenster aktiviert wird , wenn der Link eine Eigenschaft hat .
Wonsuc
45

Diese Funktion funktioniert mindestens in Firefox und Internet Explorer. Es führt alle an den Link angehängten Ereignishandler aus und lädt die verknüpfte Seite, wenn die Ereignishandler die Standardaktion nicht abbrechen.

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
quelle
5
Matthew hat Recht und stackoverflow.com/questions/809057/… hat weitere Informationen darüber, warum. Cross Browser macht Spaß :)
Dan F
4
es respektiert nicht das targetAttribut oder<base target="frame">
Vitim.us
38

Wenn Sie nur die aktuelle Seitenadresse ändern möchten, können Sie dies einfach in Javascript tun:

location.href = "http://www.example.com/test";
Fabien Ménager
quelle
53
Abgestimmt, weil ich Antworten nicht mag, die auf den Anwendungsfall antworten, anstatt ihn anzusprechen. "Ich nehme an, dass dies Ihre Absicht ist, und bin mir Ihrer Einschränkungen nicht bewusst, also mit einer konzeptuellen Sphäre in einem konzeptuellen Vakuum: Verwenden Sie diese."
Cazlab
11
Ich habe abgestimmt, weil ich nach einer guten Lösung gesucht habe, um auf den mailto:Link im userjs-Skript zu klicken. Hat mir auf jeden Fall Zeit gespart. Ich war bereit, ein aElement zu erstellen und einen "programmatischen Klick" zu machen. Stackoverflow.com/questions/809057/…
AD
6
Ich habe auch versucht, click()die an anderer Stelle und darüber vorgeschlagene Methode aufzurufen , und es hat in IE9 nicht funktioniert, aber die Einstellung location.hrefhat die E-Mail tatsächlich über den mailto:Link gesendet . Tolle Lösung!
Ajeh
Diese Methode war in PyQT4 hilfreich. Der Aufruf von click () funktionierte bei mir nicht. Vielen Dank!
VilleLipponen
Behandelt nicht meinen Anwendungsfall, der in der Frage steht, wo ich auf einen Link klicken möchte. Der Link führt nirgendwo hin, hat aber andere Dinge, die mit dem Klickereignis verbunden sind. Ich möchte den Standort nicht ändern.
Zufälliger Elefant
17

Einfach so: 

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

oder beim Laden der Seite: 

<body onload="document.getElementById('myLink').click()">
...
<a id="myLink" onclick="alert('link click');">LINK 1</a>
...
</body>
Canavar
quelle
2
Ja, aber dann muss ein anderer Klick passieren.
Ólafur Waage
2
Kannst du es auf keinen Fall tun, wie zum Beispiel beim Laden von Seiten?
Bill the Lizard
2
Vielen Dank für die Hilfe, aber ich benutze Firefox 3 und es funktioniert nicht, in der Fehlerkonsole sagt Fehler: document.getElementById ("myLink"). Klick ist keine Funktion
Es scheint, dass Firefox die Klickmethode nicht unterstützt. und die meisten Antworten, einschließlich meiner, sind nicht hilfreich :)
Canavar
@ Canavar: Versuchen Sie Klicken statt Klicken
Stefan Steiger
9

Die jQuery-Methode zum Klicken auf einen Link lautet

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

Für den MailTo-Link müssen Sie den folgenden Code schreiben

$('#LinkID')[0].click();
Muhammad Waqas Iqbal
quelle
2
Das funktioniert nicht. Dies ist nicht die Antwort auf die Frage, die er gestellt hat. Ich hätte dies negativ bewertet, wenn ich mehr Punkte gehabt hätte.
2
Das funktioniert nicht? Hast du es versucht? Ich hoffe du verstehst was "LinkID" bedeutet. Ich wäre wirklich überrascht, wenn jemand heutzutage rückständig genug wäre, um ohne jQuery zu js. Wie auch immer, zögern Sie nicht, nach einigen Punkten abzustimmen
Muhammad Waqas Iqbal
3
Ich habe es versucht und der mailTo-Link funktioniert in React Native nicht. Verwenden Sie dies: window.location.href = "mailto: [email protected]";
Pilzanthrax
4
Dies funktionierte auch bei mir nicht, wenn ich auf einen aLink klickte . Die Verwendung der [0].click()Version funktioniert, was meiner Meinung nach mit der document.getElementById('yourLinkID').click();Antwort identisch ist .
Mmm
Firefox-Browser: Dies funktioniert für <Eingabe>, aber nicht für einen <a>
jimver04
2

Für mich habe ich es geschafft, dass es so funktioniert. Ich habe den automatischen Klick in 5000 Millisekunden bereitgestellt und die Schleife nach 1000 Millisekunden geschlossen. Dann gab es nur 1 automatischen Klick.

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

Viele der oben genannten Methoden sind veraltet. Es wird jetzt empfohlen, den hier gefundenen Konstruktor zu verwenden

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

Dadurch wird auf das Ankertag geklickt, es wird jedoch nicht angezeigt, ob Popupblocker aktiv sind, sodass der Benutzer Popups zulassen muss.

Maus
quelle
3
Ich verstehe nicht, warum das Ereignis zweimal gesetzt wird. Ich sehe nicht, wie event = new CustomEvent ('click'); ist Referenzereignis, also was ist der Punkt von var ...
historystamp
Ich denke, Sie sind richtig historystamp. Er erstellt ein Mausevent und überschreibt es sofort mit einem neuen Ereignis.
John Lord
1

Können Sie anstelle des Klickens an die URL weiterleiten, zu der der Klick mit Javascript führen würde?

Vielleicht könnten Sie onLoad etwas in den Körper stecken, um dorthin zu gelangen, wo Sie wollen.

Jas Panesar
quelle
Ich habe auf beide Fragen geschrieben, weil die Leute nicht natürlich nach Schaltflächeninformationen suchen, wenn sie sich mit einem "a tag" -Link befassen. Sie sind technisch nicht miteinander verbunden.
Scott Tovey
1

Sie können sie einfach auf eine andere Seite umleiten. Eigentlich scheint es unnötig, es auf einen Link zu klicken und dorthin zu reisen, aber ich kenne nicht die ganze Geschichte.

akway
quelle
2
In meinem Fall weiß ich nicht, ob der Link das Ziel "_blank" hat, daher weiß ich nicht, ob ich location.href oder window.open verwenden soll. Es ist kürzer, einen Klick zu versenden. Es gibt Anwendungsfälle, zum Beispiel möchten Sie möglicherweise ein Ereignis wie das Öffnen einer Modalbox auslösen.
Dxvargas
-2

Sie können die Maus des Benutzers nicht dazu bringen, etwas zu tun. Sie haben jedoch die volle Kontrolle darüber, was passiert, wenn ein Ereignis ausgelöst wird.

Was Sie tun können, ist ein Klick auf die Körperlast. W3Schools hat hier ein Beispiel .

Ólafur Waage
quelle
6
@Neolit ​​es war ein schlechter Link bevor es sowieso 404'd bekam. Kein Verlust.
John Dvorak
-2

Clientseitige JS-Funktion zum automatischen Klicken auf einen Link, wenn ...

In diesem Beispiel überprüfen Sie den Wert einer versteckten Formulareingabe, die einen vom Server übermittelten Fehler enthält. Ihr clientseitiger JS überprüft dann den Wert und füllt einen Fehler an einer anderen von Ihnen angegebenen Stelle aus Fall ein Popup-Login-Modal.

var signUperror = document.getElementById('handleError')

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