Dustin
Dustin

Reputation: 6307

How do I click coordinate on page?

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.

Upvotes: 1

Views: 2814

Answers (3)

jeremy
jeremy

Reputation: 10057

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.

Upvotes: 0

Nate Bosch
Nate Bosch

Reputation: 10925

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/

Upvotes: 3

the_red_baron
the_red_baron

Reputation: 888

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

Upvotes: -1

Related Questions