Question

我使用jquery的append（）方法将元素（div）添加到父元素（div）。

当调用父div的偏移函数时，我得到它的相对位置就好了。当我调用子元素时，我的相对位置（上下左右）为0

任何人都知道如何解决这个问题？如何获得动态添加div的位置？

var $grid = $('#myDiv');
$grid.empty()
$grid.append("<div id="newDiv">...")
console.log($("#newDiv").position())

输出：top：0 left：0

（它显示当前滚动条偏离顶部）

Answer 1

返回的值是正确的。来自jquery documentation for .position()：

获取匹配元素集中第一个元素的当前坐标，相对于偏移父元素。

除非它有样式，否则它总是在0,0。

您可能希望改为使用.offset()。

Answer 2

这对你有帮助吗？（直接在下面运行）

＆＃13;

for(i=0;i<5;i++){
    $(".parent").append("<div class='child'></div>");
}

$("div.child").each( function(){
    var $this=$(this);
    var top = $this.position().top;
  
    console.log(top);
  
    $this.text( "Distance from top : " + top )
})

＆＃13;

div.child{
    height : 20px;
    outline: blue solid 1px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="parent"></div>

＆＃13;

Answer 3

这是我试图做的一个例子

＆＃13;

 

var $parent = $("parentDiv")

$parent.empty()

for(i=0;i<5;i++){
    $parent.append("<div class='child'></div>");
}

$("div.child").each( function(){
    var $this=$(this);
    var top = $this.position().top;
  
    console.log(top);
  
    $this.text( "Distance from top : " + top )
})

＆＃13;

div.child{
    height : 20px;
    outline: blue solid 1px;
}

＆＃13;

   

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div class="parentDiv"></div>

＆＃13;

Answer 4

我开始想出这个

问题可能是由backbone.js引起的，我使用data-cid来检索元素，而这些属性由于某种原因没有播种（或者为0）

Answer 5

你应该试试

var $grid = $('#myDiv');
$grid.empty()
var new_div = $grid.append("<div id='newDiv'>...")
console.log($(new_div).position())

As＆＃34; new_div＆＃34;变量具有追加函数返回的附加元素。

jquery追加元素位置总是0

5 个答案: