Comment simuler un clic en utilisant les coordonnées x, y en JavaScript?


Réponses:


146

Vous pouvez envoyer un événement de clic , bien que ce ne soit pas la même chose qu'un vrai clic. Par exemple, il ne peut pas être utilisé pour tromper un document iframe inter-domaines en lui faisant croire qu'il a été cliqué.

Tous les navigateurs modernes prennent en charge document.elementFromPointet HTMLElement.prototype.click(), depuis au moins IE 6, Firefox 5, toute version de Chrome et probablement toute version de Safari qui vous intéressera probablement. Il suivra même des liens et soumettra des formulaires:

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: oui, en fait, IE a été le premier à l'implémenter et cela remonte à IE6. Les implémentations de Chrome, Firefox et Safari 5 sont correctes mais Safari 4 et Opera sont incorrects (bien que réalisables). Voir quirksmode.org/dom/w3c_cssom.html#documentview .
Andy E

1
Je suis tellement content de cette découverte !! = D Rend maintenant beaucoup de choses jugées impossibles possibles =) ... ou du moins moins compliquées. Merci!!
RadiantHex

1
Cela ne semble pas fonctionner avec les événements $ .live (), est-ce que quelqu'un comment le faire fonctionner avec les événements créés avec $ .live () également?
ActionOwl

1
@AndyE Cela fonctionne maintenant dans la condition suivante: J'ai une page Web, je charge l'Iframe depuis un autre domaine que mon domaine. Et je veux cliquer dans la zone iframe. Avez-vous une solution à ce sujet?
Parixit

2
@parixit: non, ce n'est pas possible. Vous pouvez simuler un clic sur l'iframe mais cela ne fera que propager le document contenant. Rien dans le document contenu ne sera affecté (pour des raisons de sécurité très évidentes).
Andy E

67

Oui, vous pouvez simuler un clic de souris en créant un événement et en le distribuant:

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);
}

Méfiez-vous d'utiliser la clickméthode sur un élément - elle est largement implémentée mais pas standard et échouera par exemple dans PhantomJS. Je suppose que l'implémentation de jQuery .click()fait la bonne chose mais je n'ai pas confirmé.


M'a sauvé du désordre. Ma méthode initiale a échoué mais celle-ci est venue à la rescousse, merci.
iChux

3
plus1 pour ne pas utiliser jQuery. Contrairement à la réponse acceptée, celle-ci répond à la question.
tomekwi

1
C'est beaucoup, beaucoup plus puissant que jQuery's$.click()
Steven Lu

7
...

3
Au lieu de la version obsolète, initMouseEventvous pouvez utiliser var event = new MouseEvent( "click", { clientX: x, clientY: y, bubbles: true } )Ceci est également indiqué dans stackoverflow.com/a/36144688/384670 .
M Katz

28

Ce n'est que la réponse de torazaburo , mise à jour pour utiliser un objet MouseEvent.

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

ça marche pour moi mais ça imprime le bon élément sur la console

c'est le 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

Pour des raisons de sécurité, vous ne pouvez pas déplacer le pointeur de la souris avec javascript, ni simuler un clic avec.

Qu'est-ce que vous essayez d'accomplir?


@Aicule: merci de me l'avoir fait savoir! Je vais ajouter quelques informations à la question. Je suis juste en train d'expérimenter, rien de vraiment productif =)
RadiantHex

2
Dans Chrome et Safari, vous pouvez déclencher un clic à une position x, y spécifique. Voici comment fonctionne cette démo . Firefox est le seul navigateur où il échoue, c'est peut-être une politique de sécurité spécifique à Firefox.
thdoan

La vérité réside dans la réponse ci-dessous, createEvent()+initMouseEvent()
Valer

1
Dans mon cas, des tests.
Jose Nobile

Vous pouvez certainement simuler un clic avec des coordonnées X / Y spécifiques, même si cela ne se comportera pas exactement de la même manière.
Agamemnus
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.