Jquery 在这种特殊情况下禁用各种单击事件

我有一张图像幻灯片，但如果用户多次单击“下一步”或“上一步”按钮，则会导致幻灯片之间出现空白

这个

下面是javascript代码：

// JavaScript Document
$(function() {

var liwidth = $("#galeria ul li").outerWidth(),
speed   = 4000,
rotate  = setInterval(auto, speed)
$("section#galeria").hover(function(e){

    $("section#buttons").fadeIn();

    clearInterval(rotate);
    }, function(){
        $("section#buttons").fadeOut();
        rotate = setInterval(auto, speed);
        });



        $(".next").click(function(e){







            e.preventDefault();
                           $("section#galeria ul").css({'width' : '99999%'}).animate({left:- liwidth}, function(){
            $("#galeria ul li").last().after($("#galeria ul li").first());
            $(this).css({'left':'0', 'width':'auto'

            });
             $('.next').removeClass('active');  

            });




            });



        $(".prev").click(function(e){
            e.preventDefault();



            $("#galeria ul li").first().before($("#galeria ul li").last().css({'margin-left':-liwidth}) );
            $("section#galeria ul").css({'width':'99999%'}).animate({left:liwidth}, function(){
            $("#galeria ul li").first().css({'margin-left':'0'});   
                $(this).css({'left':'0', 'width':'auto'});

            });




        });

         function auto() {
    $(".next").click();
}


});

如何解决或预防此问题

---

谢谢你的帮助

例如，您可以在单击后立即隐藏“上一步/下一步”按钮，并在动画结束后再次显示该按钮

我不确定你是否同意这一点，但你可以试试：

1.点击后禁用按钮

---

2.在操作完成后启用它。

Leo您的代码在JSFIDLE中工作，但在我的本地主机中不工作。除了js？A=还有什么变化吗？谢谢！这解决了我的问题。我在css中的按钮部分添加了border:none。