How do I click coordinate on page?

Question

This is probably such a simple question, but after reading a few tutorials and other posts on Stack Overflow, I couldn't get what I was looking for.

Using the .click() function in jQuery, I want to click a specific X, and Y location on the page. All I found were tutorials on how to find coordinates, but not specifically click them.

I would think that you would need to move the cursor in order to do that which can't be done in JavaScript. http://stackoverflow.com/questions/2105733/mouse-move-on-element/2105766 — JDavis, Aug 23 '12 at 01:09
Possible duplicate of http://stackoverflow.com/questions/2845178/triggering-a-javascript-click-event-at-specific-coordinates — Breezer, Aug 23 '12 at 01:10
If jQuery can click on a specific element on a page, I would think it would be able to do the same just a specific location instead, wouldn't it? And no, it's not a duplicate post. — Dustin, Aug 23 '12 at 01:23

score 3 · Accepted Answer · edited May 23 '17 at 12:22

3

See Using jQuery to find an element at a particular position?

To get the element under the point (x,y) use document.elementFromPoint. You can wrap this in a jquery object and invoke the click handler to simulate an actual click.

function click(x,y) {
   var element = document.elementFromPoint(x,y);
   $(element).click();
}

Be careful of the drawbacks using elementFromPoint regarding absolute coordinates vs viewport relative coordinates http://www.zehnet.de/2010/11/19/document-elementfrompoint-a-jquery-solution/

edited May 23 '17 at 12:22

Community

1
1

answered Aug 23 '12 at 01:39

Nate Bosch

10,145
2
26
22

Bingo. Thank you so much! I knew it couldn't of been that difficult, I just couldn't get my head around it. – Dustin Aug 23 '12 at 01:42
Dboy1612 Your question was not clear that this is what you were looking for. You never said anything about getting an element; you only said that you wanted to click a coordinate. Kudos to @Nathan for figuring out what you really meant. – JDavis Aug 23 '12 at 01:49

jeremy · Answer 2 · 2012-08-23T01:42:40.573

Just bind a click event to an element, then handle it accordingly... Nothing out of the norms. As an example:

$(el).bind('click', function(event){
     var x = event.pageX,
         y = event.pageY;

     console.log(x + " : " + y); // change to alert to see results with no console
});

You don't have to worry about proper handling of getting the mouse offsets. jQuery fixes it up so you can simple say event.pageX/event.pageY to get the position in any browser. In the example above, I just set x and y as local variables, but if you have to use it outside the scope of the callable, you can just make them global. Note that this logs the coordinates to your web console and if you can't access that, change console.log to something like alert to make sure everything is working fine.

Edit: After rereading your question, my answer changes:

You can target a specific element by setting it's x and y coordinates using document.elementFromPoint. It seems supported in major browsers according to this page.

I'm feeling a bit slow here, but this clicks coordinates based on an element on a page? Or can I input the X and Y values somewhere? — Dustin, Aug 23 '12 at 01:25
I'm sorry, I've utterly misread your question. I'm updating my answer. — jeremy, Aug 23 '12 at 01:41

score -1 · Answer 3 · answered Aug 23 '12 at 01:06

-1

Here's a nice little tutorial on jQuery's documentation. Essentially it goes like so:

$('#chosen_element').click(function(e){
    alert('X position is:' + e.pageX + 'Y position is:' + e.pageY);
});

answered Aug 23 '12 at 01:06

the_red_baron

868
7
14

That's for printing where an element was clicked, not for setting the coordinates on where I want to click. Thanks for your answer though! – Dustin Aug 23 '12 at 01:25

How do I click coordinate on page?

3 Answers3