如何从图像输入中获取x＆y corrdinates？
我有一个输入设置为一种图像：
我想附加一个函数，以便我可以获得一个人点击的X和Y坐标：
$('#MapForm').submit(ClickOnMap); function ClickOnMap(data) { return false; }
我在’data’中找不到X＆Y坐标。 我究竟做错了什么？
这里有一个很好的教程， 在jQuery文档中 ：
$('#usa_map').click(function(e){ //Grab click position, mis the offset of the image to get the position inside var x = e.pageX - this.offsetLeft; var y = e.pageY - this.offsetTop; alert('X: ' + x + ', Y: ' + y); //set 2 form field inputs if you want to store/post these values //eg $("#usa_map_x").val(x); $("#usa_map_y").val(y); //Submit the form $('#MapForm').submit(); });
处理函数的参数（“Event”对象）具有“pageX”和“pageY”值。 用这些和你的img元素的“position（）”或“offset（）”做数学计算（哪个更好;我发现预测两者中的哪一个在任何特定情况下都会起作用真的很混乱）。
换句话说，img元素的“position（）”给出“顶部”和“左”值。 从“pageY”和“pageX”中减去那些，并且您在图像本身中的位置相对于其左上角。
我不确定我理解为什么你绑定到“提交”事件 – 是“提交”按钮内的图像还是什么？
您无法获取x和y值，因为submit在表单子项之前执行。
来自jQuery API ：
…当用户尝试提交表单时，提交事件将发送到元素…
……这发生在实际提交之前……