为什么我的div位置没有得到动态计算？

Question

我有jQuery：

$('img[title*=\"Show\"]').live('click', function(e) {
    //$e.preventDefault();
     e.stopImmediatePropagation();      
    var position = $('img[title*=\"Show\"]').parent().position();
    $('#popover').css('top', position.top + $('img[title*=\"Show\"]').parent().height());
    console.log(position);
    $('#popover').fadeToggle('fast');
    if ($('img[title*=\"Show\"]').hasClass('active')) {
      $(this).removeClass('active');
    } else {
      $('img[title*=\"Show\"]').addClass('active');
    }
  });

我有两张标题为“显示选项”的图像。

当我单击第一个图像时，popover div会正确显示。

当我点击第二张图片时，弹出窗口出现在第一张图片下方。

我希望它显示在第二张图片下方。

为什么是这样？

Answer 1

尝试使用偏移量而不是位置

  $(this).parent().offset();

您还必须使用“ this”代替ID，因为它始终与第一个图片匹配

Answer 2

我认为您需要将第三行更改为：

Var position = $(this).parent().position();

当事件处理程序被调用时，$（this）将引用被单击的元素。