jquery - jquery 在容器上制作动画，然后取消绑定事件

Question

嗨，我正在尝试在动画完成后取消绑定事件，并且不想在该容器上触发该事件。我的方法

$('#container').on('mouseover.grow', function(){
    $(this).parents('.secondary').animate({height:'360'},1000);
}).off('mouseover.grow');

但这种方法似乎行不通。任何关于我在这里遗漏的指针将不胜感激......

Answer 1

正如你所做的那样链接.off()方法将导致它立即触发。

您需要在方法的complete回调中调用它.animate()（即等到动画完成）：

$('#container').on('mouseover.grow', function(){
    var $this = $(this); 

    $this.parents('.secondary').animate({height:'360'},1000, function() {
        $this.off('mouseover.grow');
    });
});

还要注意，我们赋值var $this = $(this);是因为回调函数中的范围this会有所不同。