jQuery .text（）速度太慢（回调可能？）

我已经为jQuery编写了一个工具提示插件，当用户将鼠标悬停在元素上时，它会显示带有指定文本的工具提示。默认情况下，提示会显示在光标的右上角，但如果工具提示太宽而无法放在页面上，则会显示在左上角。我遇到的问题是，在使用.text（）之后，我需要检查工具提示的新宽度，看它是否比窗口宽度宽，但似乎有延迟，使得新宽度isn在我已经调用.width（）之后才设置。因此，例如，工具提示以空格开始，即使我在.width（）之前调用.text（），但在我调用.width（）时，div仍处于宽度0.下面是代码我一直在使用：jQuery .text（）速度太慢（回调可能？）

$.fn.tooltip = function(tText) { 
    this.each(function() { 
     $(this).unbind('.tipE').bind('mouseenter.tipE', function(e) { 
      $('#toolTip') 
       .hide() 
       .stop(true, true) 
       .text(tText) 
       .positionAtCursor(e) 
       .fadeIn('fast'); 
     }).bind('mouseleave.tipE', function() { 
      $('#toolTip').fadeOut('fast'); 
     }).bind('mousemove.tipE', function(e) { 
      $('#toolTip').positionAtCursor(e); 
     }); 
    }); 
}; 

$.fn.positionAtCursor = function(e) { 
    return this.each(function() { 
     var top = e.pageY - 25; 
     var left = e.pageX + 10; 

     var rightBound = $(window).width(); 
     if (rightBound && (e.pageX + $(this).width() > rightBound)) { 
      left = e.pageX - $(this).width() - 20; 
     } 

     $(this).css({ 'top' : top, 'left' : left }); 
    }); 
};

有什么办法，我可以有针对的.text（回调），这样我可以等待调用positionAtCursor（）？或者我的代码中还存在其他一些缺失的缺陷？

感谢

来源

2011-04-07 Andrew Duthie

原来这实际上是用“鼠标移动”的问题之前“的mouseenter”被调用。所以，由于直到'mouseenter'才设置文本，第一次调用positionAtCursor时宽度看起来是0。它似乎工作正常，现在我已添加'：可见'到'mousemove'中的选择器：

$('#toolTip:visible').positionAtCursor(e);

来源

2011-04-07 16:55:34

啊好的工作:) – Calum 2011-04-07 18:34:41

而不是.text(tText).positionAtCursor(e)尝试：

.html(
    function(index,oldhtml){ 
     $(this).html(tText); 
     if($(this).html()!==oldhtml){ $(this).positionAtCursor(e); } 
    }); 
)

可能是一个相当原始的方法，但也许会工作。

我想你可能也有

while($(this).html()==oldhtml){ $(this).html(tText); } 
$(this).positionAtCursor(e);

来源

2011-04-07 15:38:57 Calum

会第一个解决方案永远不会调用positionAtCursor因为目前的HTML总是比不同旧的HTML（除非，如你所建议的，你循环它）？有一段时间循环关注我，因为它可能会导致一些挂起，但我认为延迟太小以至于不应该有明显的延迟。希望有一个更直接的方法。 – 2011-04-07 16:21:18

我还没有尝试过使用这个，但我假设oldhtml是HTML元素之前，你设置新的HTML。因此，如果尚未更新，则当前的html将与旧的html相同。 – Calum 2011-04-07 18:34:24

我面临同样的问题。

的解决方案是在这里： https://stackoverflow.com/a/2716286/1238317

你应该使用dequeue()：

$('#toolTip') 
    .hide() 
    .stop(true, true) 
    .queue(YOUR_DEQUEUED_FUNCTION()) 
    .positionAtCursor(e) 
    .fadeIn('fast');

其中：

YOUR_DEQUEUED_FUNCTION = function() { 
$(this).dequeue(); 
$('#toolTip').text(tText); 
// ANY OTHER CODE BEFORE NEXT THINGS EXECUTED :) 
}

来源

2012-12-05 22:53:59 fider

jQuery .text（）速度太慢（回调可能？）

回答

相关问题