jQuery：解除绑定transtionend事件

Question

每次调用此操作时，我希望对象先向左移动，然后向上移动。第一次可以很好地工作，但是第二次，对象沿对角线而不是逐步移动。

目前我有这个：

myObject.bind("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(){ 
    myObject.css("left", 100);
    myObject.bind("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(){
        myObject.css("top", 50);
    });
});

1. 关于如何实现步进动画的其他建议吗？
2. 我如何解除这两个“绑定”的绑定，使它像第一次执行每个动作一样？

Answer 1

您需要使用.off()删除旧的绑定。否则，您将积累多个事件处理程序，并且它们将在事件之一发生时全部运行。

myObject.off("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd")
  .on("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd"),
  function() {
    myObject.css("left", 100);
    myObject.off("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd")
      .on("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd"),
      function() {
        myObject.css("top", 50);
      });
});