为什么我的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');
    }
  });

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

当我点击第一张图片时，弹出的div会正确显示。

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

我希望它出现在第二张图片的下面。

为什么会这样呢？

Answer 1

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

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

您还必须使用"this“而不是ID，因为它将始终与第一张图片匹配

Answer 2

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

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

当您的事件处理程序被调用$(this)时，它将引用被单击的元素。