Javascript jQuery在快速移动鼠标时清除队列

我有一个带缩略图的旋转木马。功能处于悬停状态，其主图像加载到旋转木马。这很好用。但若用户在拇指上快速移动并在一个拇指上停止，它不会加载当前停止的索引，而是在鼠标移动时在索引之间加载

thumbnail.hover(
  function() {
   if (!$(this).hasClass('select'))
    $(this).addClass('over');
    var index = parseInt($(this).data('index'), 10);

        if(!$(this).attr('href')){
          slideshowManuallyPaused = true;
          stopSlideshow();
          var delayOfHover = setTimeout(function () {
            gotoSlide(index);       
            clearInterval(delayOfHover);
          }, 200);                              
   }
}

---

有没有办法解决这个问题？

这可能会对您有所帮助，尽管我没有您的全部代码：

javascript:

$(document).ready(function(){

    var timer = null; 
    var thumb = $('.thumb');

    thumb.hover(function(){

        var i = thumb.index(this);
        console.log('over thumb: ' + i);

        $(this).addClass('over');

        timer = setTimeout(function(){
            console.log('executing code for thumb: ' + i);
        },500);


    },function(){

        var i = thumb.index(this);
        console.log('left thumb: ' + i);

        $(this).removeClass('over');
        clearTimeout(timer);
    })

})

html:

在函数外定义间隔，并在每次悬停新元素时将其清除。@Syd No它不起作用。

<div class="thumb"></div>
<div class="thumb"></div>
<div class="thumb"></div>
<div class="thumb"></div>
<div class="thumb"></div>
<div class="thumb"></div>
<div class="thumb"></div>