鼠标输入事件上的jQuery延迟出现问题

Question

这应该很简单。。。不知道为什么它会给我带来这样的麻烦。我有一个简单的鼠标输入功能。工作良好。我想做的是只有在悬停2.5秒后才能启动该功能。

我的工作功能是。。。

工作脚本

$('.profileimage').mouseenter(function(e) {
  $(this).parent().parent().find('.profileInfo').css({'top': (e.pageY + 25),'left': (e.pageX + 25)}).fadeIn('slow');
});

很简单。。。它所做的只是在我当前隐藏的CCD_ 1元素中淡入。

现在，为了增加延迟，我将其封装在setTimeout(function()中，因为在阅读了这里的其他一些帖子后，这似乎是正确的解决方案。所以现在我有了这个。。。

未运行脚本

$('.profileimage').mouseenter(function(e) {
  setTimeout(function() {
  $(this).parent().parent().find('.profileInfo').css({'top': (e.pageY + 25),'left': (e.pageX + 25)}).fadeIn('slow');
  }, 2500);
});

显然，我没有正确使用setTimeout函数，或者我认为这会起作用。

工作演示：http://jsbin.com/AqiFEQI/1/edit

损坏的演示：http://jsbin.com/AqiFEQI/2/edit

如果您尝试工作代码，当您将鼠标悬停在Charles上时，您会看到一个丑陋的div弹出。在破碎的样品中，什么也没发生。

任何帮助都将不胜感激。。。

Answer 1

当调用超时回调时，这将等于window。更改为

$('.profileimage').mouseenter(function(e) {
    var elem = this;
    setTimeout(function() {
       $(elem).parent().....;
    }, 2500);
});

更新的JSBin：http://jsbin.com/AqiFEQI/4/edit