INPUT type=image, how to get coordinate value?

An <input> with type="image" and name="something" will send the variables something_x and something_y to the server, along with the coordinates where the image was clicked.

If the form is being handled by JavaScript, for instance in an AJAX setup, how do I go about getting the coordinates where the element was clicked?

So far my only idea is to set:

imginput.onclick = function(e) {
    e = e || window.event;
    var coords = getMouseCoords(e), elempos = getElementCoords(this); // defined elsewhere
    this.value = (coords.x - elempos.x)+","+(coords.y - elempos.y);
}

The problem is, I'd have to make sure the onclick event is assigned to the correct input elements, e开发者_开发技巧ven if they are loaded or otherwise created after the document has loaded (a problem I've already had to face when dealing with custome tooltips). Is there maybe a better solution?

You have to select those elements after they are created to add the event listener. jQuery has a function called .live() that selects every applicable element now and in the future.

Resolved in the same way as custom tooltips: an "updateLiveContent" function that re-runs the tooltip initialisation and the input images.