Question

我想在触发鼠标滚轮时显示工具提示。这是当前的代码：

if (window.hideTimeout) {
    clearTimeout(window.hideTimeout);
}
handle.qtip('show');
window.hideTimeout = setTimeout(function() { handle.qtip('hide'); }, 1000);

这可以正常工作，但是在快速滚动时它在Firefox中运行缓慢，可能是因为使用了很多setTimeout。我想知道是否有更好的解决方案吗？如果一秒钟内没有滚动事件，我希望工具提示隐藏。

感谢

Answer 1

我认为瓶颈在handle.qtip调用中，所以请使用

if (window.hideTimeout) {
    clearTimeout(window.hideTimeout);
    //qtip is already shown.
}
else
{
    handle.qtip('show');
}
window.hideTimeout = setTimeout(function() { handle.qtip('hide'); window.hideTimeout=false}, 1000);

每次为setTimeout创建一个新的匿名函数时也是如此。只需创建一次并反复使用它。

//define once
var tipHide = function(){handle.qtip('hide'); window.hideTimeout=false}
...
//use many times
window.hideTimeout = setTimeout(tipHide, 1e3);

Answer 2

试试这个：

window.hideTimeout = function(){
    clearTimeout(window.hideTimeout);
    return setTimeout(function(){ handle.qtip('hide'); },1000);
}

这基本上会在注册新的超时之前清除你的超时。

Answer 3

如果所有其他方法都失败了，请查看underscore.js中的debounce函数。

许多setTimeouts用于滚动事件

3 个答案: