JavaScript: Add pixel position to href of each link

Question

is it possible to add the coordinates of a href-link into the target-query?

I mean something like this:

<a href="index.php?action=create&id=123&x=[...]&y=[...]" id="123">Link 123</a>

This should add the coordinates of the link (id) on the page into the query via document.write() or something.

PS: Should work without JQuery and with IE11 :)

Thanks!

Answer 1

Instead of using a bare href attach an event using javascript, grab the X & Y you want (maybe screen or client as demonstrated below) and redirect the location.href to your chosen page building up the url as needed (commented out below so you can see output).

 document.querySelector('#link').addEventListener("click",evt => { console.log("screen",evt.screenX,evt.screenY); console.log("client",evt.clientX,evt.clientY); //location.href = "somepage.php?x=" + evt.screenX + "&y=" + evt.screenY });

 <a href="#" id="link">Link</a>

By setting the value of location.href in the event handler the behaviour for the user will be the same as having clicked a link with an href attribute.