Javascript 鼠标左键停止每个循环

我有一个带有数据属性（图像对象）的锚点，在mouseenter上我想循环这些图像，然后在mouseleave上我想结束这个循环

到目前为止，我已经知道了这一点，但似乎在

shouldRotateImages

变量更改之前，完整的

每个

都会运行，即使有延迟。所以我现在有点不知所措

var shouldRotateThumbnails = false;
$(document).on('mouseenter', '#videos-list a', function () {
    shouldRotateThumbnails = true;
    rotateThumbnails($(this));
});

$(document).on('mouseleave', '#videos-list a', function () {
    shouldRotateThumbnails = false;
});

function rotateThumbnails(video) {
    var thumbnails = video.data('thumbnails');
    var image = video.find('img');
    $.each(thumbnails, function (k, v) {
        if (!shouldRotateThumbnails) {
            return false;
        }
        setTimeout(function () {
            image.attr('src', v);
        }, (300 * k));
    });
}

---

通过使用@squint的建议成功地做到了这一点

var t;
$(document).on('mouseenter', '#videos-list a', function () {
    var imageKey = 0;
    var thumbnails = $(this).data('thumbnails');
    var image = $(this).find('img');
    t = setInterval(function () {
        image.attr('src', thumbnails[imageKey]);
        imageKey += 1;
        if (imageKey == thumbnails.length) {
            imageKey = 0;
        }
    }, 300);
});
$(document).on('mouseleave', '#videos-list a', function () {
    clearInterval(t);
    var image = $(this).find('img');
    var thumbnail = $(this).data('original-thumbnail');
    image.attr('src', thumbnail);
});

---

通过使用@squint的建议成功地做到了这一点

var t;
$(document).on('mouseenter', '#videos-list a', function () {
    var imageKey = 0;
    var thumbnails = $(this).data('thumbnails');
    var image = $(this).find('img');
    t = setInterval(function () {
        image.attr('src', thumbnails[imageKey]);
        imageKey += 1;
        if (imageKey == thumbnails.length) {
            imageKey = 0;
        }
    }, 300);
});
$(document).on('mouseleave', '#videos-list a', function () {
    clearInterval(t);
    var image = $(this).find('img');
    var thumbnail = $(this).data('original-thumbnail');
    image.attr('src', thumbnail);
});

---

该代码是异步的，计划稍后执行，除非清除计时器，否则无论发生什么情况都会发生。最好不要使用像

$.each（）

这样的循环结构，而是使用

setInterval

，当它到达最后一个图像时，或者当

应该旋转缩略图时，以先到者为准，会自动清除。这正是我需要的，谢谢！不客气。代码是异步的，计划稍后执行，除非清除计时器，否则无论发生什么情况都会发生。最好不要使用像
$.each（）
这样的循环结构，而是使用
setInterval
，当它到达最后一个图像时，或者当
应该旋转缩略图时，以先到者为准，会自动清除。这正是我需要的，谢谢！不客气。