jQuery的位置（）頂部返回0而不是真正的價值

根據jQuery的正式文件，該函數應：jQuery的位置（）頂部返回0而不是真正的價值

「獲取匹配的元素集合的第一個元素的當前座標，相對於抵消父母「。

以下代碼預計返回值51，但它返回值0.任何人都可以提供洞察力爲什麼？提前致謝。

我知道添加css（top：xx）的作品，如果是這樣，是否意味着position（）僅適用於該元素具有頂部css屬性的情況？

<html> 

<head> 
    <style type="text/css"> 
     .outer 
     { 
      width:200px; 
      height:200px; 
      overflow-y:auto; 
      border:1px dotted grey; 
      position:absolute; 
     } 
     .inner 
     { 
      width:50px; 
      height:50px; 
      margin-top: 50px; 
      border:1px solid red; 
     } 
    </style> 
    <script type="text/javascript" src="jquery-1.7.2.min.js"></script> 
    <script type="text/javascript""> 

     $(document).ready(function() { 
      $('.inner').mousedown(function (e) { 
       alert($(this).position().top); 
      }) 
     }) 
    </script> 
</head> 
<body> 

    <div class="outer"> 
     <div class="inner"></div> 
    </div> 
</body> 
</html>

來源

2012-07-18 Ley

使用偏移量（）頂部http://jsfiddle.net/XpynZ/ – sofl 2012-07-18 12:33:03

@sofl這是相對於文檔，我想要得到內部div和外部div之間的長度，也就是說我需要使用位置而不是抵消。 – Ley 2012-07-18 12:40:22

該API描述是正確的。內部元素的（初始）默認CSS屬性值爲top:auto。有一個margin-top:50px，正如你知道給人的印象是內部元素是從頂部50px，但事實並非如此。 jQuery將返回position().top = 0，因爲元素的頂部確實是來自父元素的0px。

的jQuery使用.position()函數返回一個預期值，你將需要內部<div>相對位置（或絕對根據您的需求）給家長，提供頂值，並移除了margin-top屬性，例如：

.inner { 
    position:relative; 
    top:50px; 
    ... 
}

來源

2012-07-18 13:45:29 andyb

很好的解釋。很容易理解。謝謝。 – Ley 2012-07-18 13:57:53

它提醒0，這是100％正確的，因爲上面只有返回其它的值是0，當您使用它們來定位的元素，但在這裏，你正在使用邊距和填充定位元件，從而用它們來獲得頂部distance.Like

$(document).ready(function() { 
      $('.inner').mousedown(function (e) { 
       alert($(this).css("margin-top")); 
      }) 
     })

如果你想使用的位置，然後做

.inner 
     { position:absolute; 
      width:50px; 
      height:50px; 
      top: 50px; 
      border:1px solid red; 
     }

，然後做你的正常編碼

來源

2012-07-18 12:31:56 bugwheels94

謝謝。我知道這種方式是可行的，但這不是我想要的。我只想使用position（）。 – Ley 2012-07-18 12:38:38

爲什麼，我對api的理解是錯誤的？ – Ley 2012-07-18 12:41:03

我知道添加CSS（頂：XX）的作品，如果是這樣，是否意味着位置（）只適用於該元素具有頂部的CSS屬性的情況？ – Ley 2012-07-18 12:53:20

難道這能幫助您？：

document.getElementById("innerDiv").offsetTop;

或者使用jQuery的Offset方法：

的.offset（）方法可以讓我們找回元素相對的當前位置該文件。將其與.position（），進行比較，它檢索相對於偏移父級的當前位置。當在全局操作（特別是用於實現拖放操作）的現有頂點上放置新元素時， .offset（）更有用。

來源

2012-07-18 12:34:04 ThdK

我使用的是火狐13.0.1 – Ley 2012-07-18 12:36:12

好吧，我想我的猜測很快，我現在用firefox模擬你的問題，它確實是0而不是價值。我在看什麼可能。 – ThdK 2012-07-18 12:40:08

Ankit是正確的，檢查這個工作示例相對定位，而不是保證金：http://jsfiddle.net/HPSLm/ – ThdK 2012-07-18 12:42:19

jQuery的位置（）頂部返回0而不是真正的價值

回答

相關問題