¿Cómo simular un clic usando las coordenadas x, y en JavaScript?


Respuestas:


147

Puedes enviar un clic evento de , aunque esto no es lo mismo que un clic real. Por ejemplo, no se puede utilizar para engañar a un documento iframe de dominios cruzados haciéndole creer que se hizo clic en él.

Todos los navegadores modernos son compatibles document.elementFromPointy HTMLElement.prototype.click(), desde al menos IE 6, Firefox 5, cualquier versión de Chrome y probablemente cualquier versión de Safari que le interese. Incluso seguirá enlaces y enviará formularios:

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: sí, de hecho IE fue el primero en implementarlo y se remonta a IE6. Las implementaciones de Chrome, Firefox y Safari 5 están bien, pero las de Safari 4 y Opera son incorrectas (aunque viables). Consulte quirksmode.org/dom/w3c_cssom.html#documentview .
Andy E

1
¡¡Estoy tan feliz con este descubrimiento !! = D Hace que muchas cosas consideradas imposibles sean posibles ahora =) ... o al menos menos complicadas. ¡¡Gracias!!
RadiantHex

1
Esto no parece funcionar con eventos $ .live (), ¿alguien sabe cómo hacerlo funcionar con eventos creados con $ .live () también?
ActionOwl

1
@AndyE Esto ahora funciona en la siguiente condición: Tengo una página web, estoy cargando Iframe desde otro dominio que no sea mi dominio. Y quiero hacer clic en el área de iframe. ¿Tiene alguna solución al respecto?
Parixit

2
@parixit: no, no es posible. Puede simular un clic en el iframe, pero simplemente se propagará hasta el documento que lo contiene. Nada en el documento contenido se verá afectado (por razones de seguridad muy obvias).
Andy E

67

Sí, puede simular un clic del mouse creando un evento y enviándolo:

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

Tenga cuidado con el uso del clickmétodo en un elemento: está ampliamente implementado pero no es estándar y fallará, por ejemplo, en PhantomJS. Supongo que la implementación de jQuery .click()hace lo correcto pero no lo he confirmado.


Me salvó de un lío. Mi método inicial falló, pero este vino al rescate, gracias.
iChux

3
plus1 por no usar jQuery. Al contrario de la respuesta aceptada, éste hace responder a la pregunta.
tomekwi

1
Esto es mucho, mucho más poderoso que el de jQuery$.click()
Steven Lu

7

3
En lugar de los obsoletos initMouseEvent, puede usar var event = new MouseEvent( "click", { clientX: x, clientY: y, bubbles: true } )Esto también se muestra en stackoverflow.com/a/36144688/384670 .
M Katz

28

Esta es solo la respuesta de torazaburo , actualizada para usar un objeto 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

No me funciona, pero imprime el elemento correcto en la consola.

este es el código:

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

Por razones de seguridad, no puede mover el puntero del mouse con javascript ni simular un clic con él.

¿Qué es lo que está tratando de lograr?


@Aicule: ¡gracias por hacérmelo saber! Agregaré un poco de información a la pregunta. Solo estoy experimentando, nada realmente productivo =)
RadiantHex

2
En Chrome y Safari, puede disparar un clic en una posición x, y específica. Así es como funciona esta demostración . Firefox es el único navegador en el que falla, por lo que tal vez sea una política de seguridad específica de Firefox.
jueves

La verdad está en la respuesta a continuación, createEvent()+initMouseEvent()
Valer

1
En mi caso, testing.
Jose Nobile

Definitivamente puede simular un clic con coordenadas X / Y específicas, aunque no se comportará exactamente de la misma manera.
Agamemnus
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.