jQuery position() 返回不正确，然后是正确的结果答案

【问题标题】：jQuery position() returning incorrect, then correct, resultsjQuery position() 返回不正确，然后是正确的结果
【发布时间】：2017-06-28 15:51:39
【问题描述】：

简单的一个（可能，了解我）

我正在向（Wordpress）网站附加一个元素。标准设置。没什么花哨的。

该行的内容类似于：

jQuery('[id*="my-required-id-text"]').append('<div class="my-appended-div">A Div</div>')

现在，我的问题是，如果我要循环使用每个附加的 div 位置：

console.log(jQuery('.my-appended-div').last().position())

我 - 恼人 - 得到所有顶部和左侧的位置，完全相同。更令人恼火的是，如果我要对班级进行一次点击，并将 console.log 放在其中的位置，它将显示我点击的正确位置。

这是为什么？我正在撕裂 - 剩下的 - 我的头发掉了。

我知道我有点含糊，但请假设我的 CSS 和其余相关代码是正确的。我只是想知道为什么位置被错误地检测到并且与所有其他（视觉上不同的放置）div相同，但在运行循环之后立即（是的，这是一个根据输入的数据量输出div的循环），并且将输出分配给另一个事件，这些位置突然都被控制台正确记录了。

非常感谢您的阅读。

【问题讨论】：

"请假设我的..." 不，您应该发布所有相关代码（包括 HTML），以便我们这些愿意帮助您的人了解全貌。
呃 jQuery('.my-appended-div').last() 只得到最后一个，那里没有迭代？
我没有包含迭代或代码的任何其他部分，因为我不希望其他事情与问题混淆。斯巴达克斯。 “应该”意味着有一个规则。没有规则。我特意保留了这些信息，以避免混淆实际问题。当你有什么问题时不要告诉我什么是什么。
祝你好运，亚当

标签： javascript jquery html css wordpress

【解决方案1】：

它最有可能以这种方式出现，因为您只是在控制台多次记录 .last() div。你得到的位置响应当然只会给你顶部和左侧的位置，因为 position() 只给你从父级的顶部和左侧偏移量 - see the docs - 但同样，即使你正在循环， .last() div 在循环时不会改变......它是同一个 div。

当然，我可能错了（你还没有发布你的代码），但我相当有信心这是问题所在。您可能希望使用不同的选择器进行循环（可能使用 this 作为选择器）。

【讨论】：

我 - 在真实的代码中 - 正确地迭代每个单独的 div 而不仅仅是最后一个，因为每次迭代都会附加一个 div，然后它成为最后一个。
对，我的意思是，因为 javascript 是异步的，所以您可以使用 append 循环正确循环，但是当您到达 console.log 问题时，循环已经完成，所以它只是打印出 last() div x 次数。 See this if you don't understand what I mean
好的，我明白你的意思。以前没有。感谢您进一步解释。我在测试期间一直在添加 ID，但在专门针对然后可悲的是得到了相同的结果。但是，我现在将回到那个测试，以避免你描述的场景。
有更深入的了解。这导致我解决了问题，非常感谢你。标记为已回答。
很高兴它有帮助。这是一个彻头彻尾的“陷阱”，可能让所有接触过 Javascript 的开发人员都感到困惑，所以这是一件值得学习的好东西！

【解决方案2】：

我不确定您的问题，但尝试在“每个”之后获得位置：

$objects.each(function(){
  ...
}).promise().done(function(){
  $('.my-appended-div').last().position();
});

精度低：position() 依赖于这个父级，而 offset() 依赖于窗口。

【讨论】：

我知道你在那里尝试什么。我得到 jQuery.each(...).promise 不是一个函数。