Wie simuliere ich einen Klick mithilfe von x, y-Koordinaten in JavaScript?


Antworten:


145

Sie können ein Klickereignis auslösen, obwohl dies nicht mit einem echten Klick identisch ist. Zum Beispiel kann es nicht verwendet werden, um ein domänenübergreifendes iframe-Dokument zu täuschen, dass es angeklickt wurde.

Alle modernen Browser unterstützen document.elementFromPointund HTMLElement.prototype.click(), da mindestens IE 6, Firefox 5, jede Version von Chrome und wahrscheinlich jede Version von Safari, die Sie wahrscheinlich interessieren. Es wird sogar Links folgen und Formulare einreichen:

document.elementFromPoint(x, y).click();

https://developer.mozilla.org/En/DOM:document.elementFromPoint https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click


1
@RadiantHex: Ja, tatsächlich war IE der erste, der es implementiert hat, und es geht weit zurück zu IE6. Chrome-, Firefox- und Safari 5-Implementierungen sind in Ordnung, aber Safari 4 und Opera sind falsch (obwohl sie funktionieren). Siehe quirksmode.org/dom/w3c_cssom.html#documentview .
Andy E

1
Ich freue mich sehr über diese Entdeckung !! = D Macht jetzt viele Dinge für unmöglich =) ... oder zumindest weniger kompliziert. Vielen Dank!!
RadiantHex

1
Dies scheint nicht mit $ .live () - Ereignissen zu funktionieren. Kann jemand dafür sorgen, dass es auch mit Ereignissen funktioniert, die mit $ .live () erstellt wurden?
ActionOwl

1
@AndyE Dies funktioniert jetzt unter folgenden Bedingungen: Ich habe eine Webseite und lade Iframe von einer anderen Domain als meiner Domain. Und ich möchte in den Iframe-Bereich klicken. Haben Sie eine Lösung dafür?
Parixit

2
@parixit: Nein, das ist nicht möglich. Sie können einen Klick auf den Iframe simulieren, der jedoch nur das enthaltende Dokument weitergibt. Nichts in dem enthaltenen Dokument ist betroffen (aus sehr offensichtlichen Sicherheitsgründen).
Andy E

66

Ja, Sie können einen Mausklick simulieren, indem Sie ein Ereignis erstellen und auslösen:

function click(x,y){
    var ev = document.createEvent("MouseEvent");
    var el = document.elementFromPoint(x,y);
    ev.initMouseEvent(
        "click",
        true /* bubble */, true /* cancelable */,
        window, null,
        x, y, 0, 0, /* coordinates */
        false, false, false, false, /* modifier keys */
        0 /*left*/, null
    );
    el.dispatchEvent(ev);
}

Achten Sie darauf, dass Sie die clickMethode nicht für ein Element verwenden - sie ist weit verbreitet, aber nicht Standard und schlägt beispielsweise in PhantomJS fehl. Ich gehe davon aus, dass die Implementierung von jQuery .click()das Richtige tut, habe dies jedoch nicht bestätigt.


Hat mich vor einem Durcheinander gerettet. Meine anfängliche Methode schlug fehl, aber diese kam zur Rettung, danke.
iChux

3
plus1 für die Nichtverwendung von jQuery. Im Gegensatz zu der akzeptierten Antwort, dieser tut die Frage beantworten.
Tomékwi

1
Dies ist viel, viel mächtiger als jQuery's$.click()
Steven Lu


3
Anstelle der veralteten können initMouseEventSie dies verwenden. var event = new MouseEvent( "click", { clientX: x, clientY: y, bubbles: true } )Dies wird auch in stackoverflow.com/a/36144688/384670 angezeigt .
M Katz

27

Dies ist nur die Antwort von torazaburo , die aktualisiert wurde, um ein MouseEvent-Objekt zu verwenden.

function click(x, y)
{
    var ev = new MouseEvent('click', {
        'view': window,
        'bubbles': true,
        'cancelable': true,
        'screenX': x,
        'screenY': y
    });

    var el = document.elementFromPoint(x, y);

    el.dispatchEvent(ev);
}

0

Es funktioniert nicht für mich, aber es druckt das richtige Element auf die Konsole

Das ist der Code:

function click(x, y)
{
    var ev = new MouseEvent('click', {
        'view': window,
        'bubbles': true,
        'cancelable': true,
        'screenX': x,
        'screenY': y
    });

    var el = document.elementFromPoint(x, y);
    console.log(el); //print element to console
    el.dispatchEvent(ev);
}
click(400, 400);

-2

Aus Sicherheitsgründen können Sie den Mauszeiger weder mit Javascript bewegen noch einen Klick damit simulieren.

Was versuchen Sie zu erreichen?


@Aicule: Danke, dass du mich informiert hast! Ich werde der Frage ein paar Informationen hinzufügen. Ich experimentiere nur, nichts wirklich produktives =)
RadiantHex

2
In Chrome und Safari können Sie einen Klick auf eine bestimmte x, y-Position auslösen. So funktioniert diese Demo . Firefox ist der einzige Browser, bei dem ein Fehler auftritt. Möglicherweise handelt es sich also um eine Firefox-spezifische Sicherheitsrichtlinie.
Dooan

Die Wahrheit liegt in der Antwort unten, createEvent()+initMouseEvent()
Valer

1
In meinem Fall testen.
Jose Nobile

Sie können definitiv einen Klick mit bestimmten X / Y-Koordinaten simulieren, obwohl er sich nicht genau so verhält.
Agamemnus
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.