jQuery：mouseup + position：absolute + show（）。 IE中的问题

Question

我正在尝试实现当用户选择特定<div>中的某些文字时显示的弹出窗口。 工具提示是<div>，页面底部带有display: none和position: absolute CSS属性。

在可选div的mouseup事件处理程序中，我正在执行以下操作：

$("#popup").css({
    top: e.pageY,
    left: e.pageX
}).show();

这是一个有效的JS小提琴：http://jsfiddle.net/6r4Lrgmv/

它在Chrome和Firefox中运行良好但是Internet Explorer（我已经在版本9和11上测试过）选择页面上的文本直到底部。我究竟做错了什么？这个问题有解决方法吗？

Answer 1

我的猜测是：在显示弹出窗口时，IE认为你的鼠标光标实际上在弹出窗口内。所以它选择文本到页面的末尾。

我找到了两种可能的解决方案（使用IE 11测试）：

• 在弹出式位置添加+1。这样弹出窗口就不会直接出现在鼠标光标下。

  $("#popup").css({
      top: e.pageY + 1,
      left: e.pageX + 1
  }).show();
  

• 使用setTimeout。这样，在事件结束后（在当前事件队列的末尾）显示弹出窗口。

  setTimeout(function() {
      $("#popup").css({
          top: e.pageY,
          left: e.pageX
      }).show();
  });