使用javascript在x,y上模拟鼠标点击

I am trying to simulate a mouse click at x,y co-ordinates using javascript. I am using the following functions which works fine for most of the html elements:

我正在尝试使用javascript在x,y坐标上模拟鼠标点击。我正在使用以下功能，对大多数html元素都适用:

setTimeout(function() {
    var event = document.createEvent("MouseEvents");
    event.initEvent("click", true, true);
    document.elementFromPoint(x, y).dispatchEvent(event);
}, 1000);

However,it is unable to select a text-box(input html control) when a co-ordinate contained within the text box is clicked.

但是，当单击文本框中包含的坐标时，它不能选择文本框(输入html控件)。

Is there anyway i can simulate selecting an input html element?

我是否可以模拟选择输入的html元素?

Note:There is something on top of the webpage and i am kinda passing the click operation to the webpage below it using javascript.

注意:页面顶部有一些东西，我正在使用javascript将点击操作传递给下面的页面。

1 个解决方案

#1

This jsfiddle demonstrates the problem you are likely facing. When you execute document.elementFromPoint(x, y) it doesn't get beyond your overlay because your overlay is at the front of z-index of your document.

这个jsfiddle演示了您可能面临的问题。当您执行文档。elementFromPoint(x, y)不会超出覆盖层，因为覆盖层位于文档的z-index的前面。

In order to get past this, you can bind a click handler to the overlay, quickly hide it, get the element underneath, then show the overlay again.

为了克服这个问题，您可以将一个单击处理程序绑定到覆盖层，快速隐藏它，获取下面的元素，然后再次显示覆盖。

See this jsfiddle

看到这个jsfiddle

overlay.addEventListener("click", function (e) {
    var element = null;

    this.style.display = 'none'; //Hide it.
    element = document.elementFromPoint(e.x, e.y); //Get your element
    this.style.display = ''; //Unhide it.

    var event = document.createEvent("MouseEvents");
    event.initEvent("click", true, true);
    element.dispatchEvent(event);
});

This will click behind your overlay. However, simply triggering the click event on a text input element won't give it focus.

这将点击你的覆盖层后面。然而，仅仅触发文本输入元素上的单击事件不会使其集中。

I'm not sure what jQuery is doing in the source...I tried to track it down, but couldn't. However, using jQuery's focus() method works here.

我不确定jQuery在源代码中做了什么……我试图找到它，但没找到。但是，使用jQuery的focus()方法在这里工作。

overlay.addEventListener("click", function (e) {
    var element = null;

    this.style.display = 'none'; //Hide it.
    element = document.elementFromPoint(e.x, e.y);
    this.style.display = ''; //Unhide it.

    $(element).focus();
});

#1