javascript - 在不同浏览器上显示不同坐标的图像

Question

我正在绘制固定宽度和高度的图像。我允许用户单击图像 - 并存储单击图像的位置（xy 坐标）。这是一个示例代码：

<script language="JavaScript" type="text/JavaScript">
    var posx; var posy;

 function showP(e) {
        // captures the mouse position
        posx = 0; posy = 0;
        if (!e) { var e = window.event; }
        if (e.pageX || e.pageY) {
            posx = e.pageX;
            posy = e.pageY;
        }
        else if (e.clientX || e.clientY) {
            posx = e.clientX;
            posy = e.clientY;
        }
        alert('X mouse is: ' + posx + ' Y mouse is: ' + posy );
    } 
</script>

我注意到对于图像上的固定点，我在不同的浏览器上得到不同的 X 和 Y 坐标。

谁能说出为什么会这样。谢谢

Answer 1

您可以检查您在活动中获得的所有数据

 var a = "";
 for (var key in e){ 
     if( typeof e[key]!='function' &&  typeof e[key] !='object' )
     a += key+'='+ e[key]+'\n' 
  }
  alert(a)

此结构可帮助您比较浏览器中的边距和内边距

var padding = parseInt($("#imgId").css("padding-top"));

我认为您需要调查您的代码和样式，也许您与影响结果的填充和边距有一些冲突。

希望这种方式对您有所帮助。