javascript-防止jQuery中出现双重动画

当用户单击速度太快时,如何阻止该功能发生两次？

$(document).ready(function() {
    $(".jTscroller a").click(function(event) {
        event.preventDefault();
        var target = $(this).attr("href");
        $("#photo").fadeto("fast", 0, function() {
            $("#photo").attr("src",target);
            $("#photo").load(function() {
                $("#photo").fadeto("fast", 1);
            });
        });
    });
});

我遇到的问题是,如果用户单击得太快,该元素将不会消失,它只会保持隐藏状态.

问题不是我想的那样.当我单击相同的缩略图时,它将尝试加载到同一图像中并永远坚持加载. .stop()答案确实修复了双重动画,因此我接受该答案,但是我的解决方案是检查最后单击的项目是否为当前显示的项目.新脚本：

$(document).ready(function() {
    $(".jTscroller a").click(function(event) {
        event.preventDefault();
        var last = $("#photo").attr("src");                 
        var target = $(this).attr("href");
        if (last != target) {
            $("#photo").stop().fadeto("fast", 0, function() {
                $("#photo").attr("src",target);
                $("#photo").load(function() {
                    $("#photo").fadeto("fast", 1);
                });
            });
        };
    });
});

解决方法:

好吧,您在描述中使用正确的单词.使用stop()

$("#photo").stop().fadeto("fast", 0, function() {