得到鼠标的位置相对于父元素

问题描述：

<div id="uxcParent"> 
<div id="uxcClickable"></div> 
</div>

现在，当在内部元件用户点击我想相对于父DIV，而不是网页的鼠标位置。

这是我试过的。

var x= e.pageX- obj.offsetLeft; 
var y= e.pageY- obj.offsetTop;

这工作正常，只有当我不滚动页面。我希望函数能够返回相同的值，而不管我的元素在同一页面上。

更新：

我认为这是不够清晰。我现在详述更多..

认为这些元素是相对于文档在x位置的文档。该页面有一个滚动条。现在我可以滚动到页面的任何部分，位置仍然是x。但相对于观察口的位置会发生变化。所以pageX和pageY会给出不同的值。这是我的追赶。

我的元素可以随时随地在视口中，当我走在内部元件我应该得到坐标相对于只母

希望我（不应该由当父所影响）现在很清楚。

这是一个错字或实际上在你的代码中，你正在引用Y坐标到x变量？ – markcial 2010-03-25 12:42:57

这是一个错字..已经改变.. – ZX12R 2010-03-25 12:49:47

答

如果滚动是唯一让你烦恼的事情，那么我会认为在scrollLeft和scrollTop中添加可以解决这个问题。

答

这很有趣，我认为this document可以帮助你很多。

答

为此，您可以使用jQuery这样的：

<html> 
<head> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
jQuery(document).ready(function(){ 
    $("#special").click(function(e){ 
     $('#status2').html(e.pageX +', '+ e.pageY); 
    }); 
}) 
</script> 
<body> 

<h2 id="status2"> 
0, 0 
</h2> 
<div style="width: 100px; height: 100px; background:#ccc;" id="special"> 
Click me anywhere! 
</div> 
</body> 
</html>

注意，像素值给出相对于整个文档。如果要计算特定元素内或视口内的位置，可以查看offsetY和offsetX，并执行一些算术运算以找到相对值。

这里是找到特定元件内的位置，而不是页的一个示例：

$("#special").click(function(e){ 

    var x = e.pageX - this.offsetLeft; 
    var y = e.pageY - this.offsetTop; 

     alert(x +', '+ y); 
    });

在哪里“特殊”是内元件的ID。

我在jquery文档中看到了这个。这不是我的问题..我会更新我的问题，并使其更清楚.. – ZX12R 2010-03-25 12:51:14

得到鼠标的位置相对于父元素

相关推荐