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);
    });
});

关于如何实现步进动画还有其他建议吗？
如何解除这两个 "bindings" 的绑定，以便运行每次操作都像第一次一样？

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);
      });
});

jQuery: 解绑transtionend事件

jQuery: Unbinding transtionend event

jquery

transition

transitionend