Как смоделировать щелчок, используя координаты x, y в JavaScript?


Ответы:


151

Вы можете отправить событие щелчка , хотя это не то же самое, что настоящий щелчок. Например, его нельзя использовать, чтобы обмануть междоменный документ iframe, заставив думать, что по нему щелкнули.

Все современные браузеры поддерживают document.elementFromPointи HTMLElement.prototype.click(), по крайней мере, IE 6, Firefox 5, любую версию Chrome и, возможно, любую версию Safari, которая может вам понравиться. Он даже будет переходить по ссылкам и отправлять формы:

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: да, на самом деле IE был первым, кто реализовал это, и это восходит к IE6. Реализации Chrome, Firefox и Safari 5 хороши, но Safari 4 и Opera некорректны (хотя и работают). См. Quirksmode.org/dom/w3c_cssom.html#documentview .
Andy E

1
Я так рада этому открытию !! = D Делает возможным то, что кажется невозможным =) ... или, по крайней мере, менее сложным. Благодарность!!
RadiantHex

1
Это не работает с событиями $ .live (), кто-нибудь, как заставить его работать с событиями, созданными с помощью $ .live ()?
ActionOwl,

1
@AndyE Теперь это работает в следующих условиях: у меня есть веб-страница, я загружаю Iframe из другого домена, чем мой домен. И я хочу щелкнуть в области iframe. У вас есть какое-то решение по этому поводу?
Parixit

2
@parixit: нет, это невозможно. Вы можете имитировать щелчок по iframe, но он просто распространится вверх по содержащемуся документу. Ничто в содержащемся документе не будет затронуто (по очень очевидным причинам безопасности).
Andy E

67

Да, вы можете имитировать щелчок мышью, создав событие и отправив его:

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

Остерегайтесь использования clickметода для элемента - он широко реализован, но не является стандартным и не работает, например, в PhantomJS. Я предполагаю, что реализация jQuery .click()работает правильно, но не подтвердила.


Спас меня от беспорядка. Мой первоначальный метод не удался, но этот пришел на помощь, спасибо.
iChux

3
plus1 за неиспользование jQuery. В отличие от принятого ответа, этот действительно отвечает на вопрос.
tomekwi 02

1
Это намного, намного мощнее, чем jQuery$.click()
Стивен Лу


3
Вместо устаревшего initMouseEventвы можете использовать var event = new MouseEvent( "click", { clientX: x, clientY: y, bubbles: true } )Это также показано в stackoverflow.com/a/36144688/384670 .
M Katz

28

Это просто ответ торазабуро , обновленный для использования объекта 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

это работает для меня, но он выводит правильный элемент на консоль

это код:

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

По соображениям безопасности вы не можете перемещать указатель мыши с помощью javascript или имитировать с его помощью щелчок.

Чего вы пытаетесь достичь?


@Aicule: спасибо, что сообщили мне! Я добавлю немного информации к вопросу. Я просто экспериментирую, ничего особо продуктивного =)
RadiantHex

2
В Chrome и Safari вы можете щелкнуть мышью в определенной позиции x, y. Вот как работает эта демонстрация . Firefox - единственный браузер, в котором он не работает, так что, возможно, это политика безопасности, специфичная для Firefox.
thdoan

Истина заключается в ответе ниже, createEvent()+initMouseEvent()
Валер

1
В моем случае тестирование.
Хосе Нобиле

Вы определенно можете имитировать щелчок с определенными координатами X / Y, хотя это не будет вести себя точно так же.
Agamemnus
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.