jQuery：偏移量和位置返回相同的值

Question

我试图检测表中的元素。 但是，jquery为offset和position返回相同的值。 我想要的是元素相对于表格列的位置。

为什么我的jQuery offset和position都返回相同的值？ 返回的值实际上是偏移值。 我如何获得头寸价值？

谢谢。

这是我的代码：

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>test offset & position</title>
</head>
<!-- Bootstrap core CSS -->
<link href="bootstrap.min.css" rel="stylesheet">
<style type="text/css">
table.table tbody tr td{
  vertical-align:middle;
}
</style>
<body>
  <table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-hover table-bordered">
   <thead>
    <tr>
     <th>Rendering engine</th>
     <th>Browser</th>
     <th>Platform(s)</th>
     <th>Engine version</th>
   </tr>
 </thead>
 <tbody>
  <tr>
   <td><select name="select" class="detect">
     <option>100</option>
     <option>20</option>
     <option>3</option>
     <option>4</option>
     <option>5</option>
   </select>
   <div class="cover"></div></td>
   <td><p>Internet
    Explorer 4.0</p>
    <p>dsfds</p>
    <p>df</p></td>
    <td><textarea class="detect">4444  444

     dsfdsfdsf ds fds f

     dsf
     ds
     fsd
     fs</textarea></td>
     <td><div><textarea class="detect">4</textarea></div></td>
   </tr>

 </tbody>
</table>
<script src="jquery-1.10.2.min.js"></script>

<script>
$(function(){
  $(".detect").focus(function(e) {
    console.log("height:"+$(this).height()+" width:"+$(this).width()+" position top:"+$(this).position().top+" position left:"+$(this).position().left +" offset top:"+$(this).offset().top+" offset left:"+$(this).offset().left);
  });
});
</script>
</body>
</html>

Answer 1

尝试添加位置：相对； 到父元素

Answer 2

position返回相对于偏移父级的位置，而offset相对于文档执行相同的操作。 显然，如果文档是偏移父级（通常是这种情况），则它们将是相同的。

jQuery：偏移量和位置返回相同的值

问题描述

2 个解决方案

解决方案1
2 2013-10-11 08:41:07

解决方案2
-1 已采纳 2013-10-11 08:37:10

jQuery：偏移量和位置返回相同的值

问题描述

2 个解决方案

解决方案1 2 2013-10-11 08:41:07

解决方案2 -1 已采纳 2013-10-11 08:37:10

解决方案1
2 2013-10-11 08:41:07

解决方案2
-1 已采纳 2013-10-11 08:37:10