如何使用 JavaScript 中的 x,y 坐标模拟点击?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3277369/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 03:59:56  来源:igfitidea点击:

How to simulate a click by using x,y coordinates in JavaScript?

javascriptjqueryhtmlmouseeventmouseclick-event

提问by RadiantHex

Is it possible to use given coordinates in order to simulate a click in JavaScript within a webpage?

是否可以使用给定的坐标来模拟网页中 JavaScript 的点击?

回答by Andy E

You can dispatch a clickevent, though this is not the same as a real click. For instance, it can't be used to trick a cross-domain iframe document into thinking it was clicked.

您可以调度click事件,但这与真正的点击不同。例如,它不能用于诱使跨域 iframe 文档认为它已被点击。

All modern browsers support document.elementFromPointand HTMLElement.prototype.click(), since at least IE 6, Firefox 5, any version of Chrome and probably any version of Safari you're likely to care about. It will even follow links and submit forms:

所有现代浏览器都支持document.elementFromPointHTMLElement.prototype.click(),因为至少 IE 6、Firefox 5、任何版本的 Chrome 以及您可能关心的任何版本的 Safari。它甚至会跟随链接并提交表格:

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

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

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

回答by RadiantHex

Yes, you can simulate a mouse click by creating an event and dispatching it:

是的,您可以通过创建一个事件并分派它来模拟鼠标点击:

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

Beware of using the clickmethod on an element -- it is widely implemented but not standard and will fail in e.g. PhantomJS. I assume jQuery's implemention of .click()does the right thing but have not confirmed.

当心click在元素上使用该方法——它被广泛实现但不是标准的,并且会在例如 PhantomJS 中失败。我认为 jQuery 的实现是.click()正确的,但尚未确认。

回答by user2067021

This is just torazaburo's answer, updated to use a MouseEvent object.

这只是torazaburo 的答案,更新为使用 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);
}

回答by VilgotanL

it doenst work for me but it prints the correct element to the console

它确实对我有用,但它会将正确的元素打印到控制台

this is the 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);

回答by quantumSoup

For security reasons, you can't move the mouse pointer with javascript, nor simulate a click with it.

出于安全原因,您不能用 javascript 移动鼠标指针,也不能用它模拟点击。

What is it that you are trying to accomplish?

你想要完成什么?