Javascript jQuery重新绑定函数

我想有一个div，它可以在视图外设置当前活动图像的动画，而不是在另一个图像中设置动画。其中有几个div，每个div都应该具有相同的基本功能，但链接到不同的图像。我遇到的问题是，在动画完成之前，可以单击许多div，这会同时触发其他动画。我的目标是一次只能触发一个动画，当动画完成时，您可以触发下一个动画。我试过使用unbind，它可以正常工作，但后来我不得不重新绑定它，我不知道怎么做。我真的是一个jquerynoob，所以我非常希望得到一个答案。谢谢

我的代码：

$('.div1').click(function clickevent() {
    $('.img2, .img3').animate({
        opacity: 0.1,
        left: 600
    }, 1000, function() {
        $('.img1').animate({
            opacity: 1,
            left: 0
        }, 500, function() {
            $('.div2, .div3').bind('click', clickevent); /* Here I want to rebind the function */
        });
    });
    $(this).addClass("active");
    $('.div2, div3').removeClass("active");
    $('div2, .div3').unbind('click', clickevent);
});

我还有另外两个.div2和.div3的代码块，它们看起来相同，但在不同的地方有不同的类。在能够再次设置动画之前，是否有任何方法使图像完成动画？谢谢。

这就是您需要的：

var canAnimate = true;
$('.div1').click(function clickevent() {
    // these 4 lines have to be in all code blocks (ie. for .div2 and .div3)
    if (! canAnimate) {
        return;
    }
    canAnimate = false;

    $('.img2, .img3').animate({
        opacity: 0.1,
        left: 600
    }, 1000, function() {
        $('.img1').animate({
            opacity: 1,
            left: 0
        }, 500, function() {
            canAnimate = true; // this should also be included for .div2 and .div3 code blocks
        });
    });
    $(this).addClass("active");
    $('.div2, div3').removeClass("active");
});

我认为queue（）将附加动画，但不会停止它们，因此，如果在图像上单击10次，单击处理程序将一个接一个地为其设置动画10次。我猜您只希望在当前没有图像动画时设置图像动画，以便您可以使用：

$('.div1').click(function clickevent() {
    // When no image is currently animated then perform the animation
    if($j('.img1, .img2, .img3').is(':animated') == false)
    {
        $('.img2, .img3').animate({
            opacity: 0.1,
            left: 600
        }, 1000, function() {
            $('.img1').animate({
                opacity: 1,
                left: 0
            }, 500);
        });
        $(this).addClass("active");
        $('.div2, div3').removeClass("active");
   } else {
        // There is currently an animation runnig, do nothing
   }
});

有关更多信息，请参见此：

---

您还应该获得一些有关缓存选择结果的信息。

是的，请使用

.queue（）

就在

.animate（）

之后，对于我对jQuery缺乏了解，我感到非常抱歉，但是您能告诉我您的代码片段应该放在哪里吗。谢谢你花时间回答我的问题，我很感激。恐怕我不理解你的代码，我就像我说的jQuery是一个完整的noob，所以如果你能详细说明你的答案，我将不胜感激。感谢您抽出时间回答我的问题。这与jQuery没有多大关系……无论如何，我已经更新了我的代码以包含所有内容。我想我是一个有点全面的noob；）。您的解决方案似乎在第一次修改div时起作用，但不是在以后。这可能是因为if语句吗。？我怎样才能解决它？谢谢您是否也添加了

canAnimate=true在其他代码块中？应该是这样的。我已经用注释更新了代码。让我们