Gsap 每次动画重复时运行函数

下面是一个为反弹的正方形设置动画的脚本：

但是，

onRepeat

选项的行为与我预期的不一样。它不会在每次动画重复时触发log函数，而是在动画第一次启动时运行一次

---

它的行为与

onStart

选项完全相同。为什么会这样？我怎样才能让div计算它无限反弹了多少次

当您使用

log（）

定义tween时，您正在运行

log

函数，并将

log

的返回值分配给

onRepeat

（这是

未定义的

，因为您不返回任何内容）。您希望将

onRepeat

var分配给

log

函数

改变

onRepeat: log()

到

---

您可以在实际操作中看到这一点

Patrick确实回答了这个问题，但如果您希望将参数传递给要运行的函数，请执行以下操作重复：

onRepeatParams: ['as','many','parameters','as',1,true,'ly','wants'];

我还认为，访问时间线应用到的元素的最有效方法是使用self关键字，如下所示：

onRepeatParams: ["{self}"];

然后在函数中执行以下操作：

$(element.target).html('I\'ve bounced: ' + count + ' times!');

以下是我在上下文中的意思：

var count = 1,
       tM = new TimelineLite(),
       element = $('#boxy');

function log(element){
    console.log('just bounced');
    $(element.target).html('I\'ve bounced: ' + count + ' times!');
    count++;
}

tM.from( element, 2, { top:'-=60px', ease: Linear.easeNone, repeat: -1, onRepeat: log, onRepeatParams: ["{self}"] }, 0 );

---

Ah好的，但是如果要将参数传递给log函数，应该怎么做？可以定义一个调用log

onRepeat:function（）{log（args…；}

。Greensock还允许您定义

onRepeatParams

一个数组，该数组被传递到

onRepeat

非常感谢，在您发表评论的第二天就解决了这个问题，哈哈

$(element.target).html('I\'ve bounced: ' + count + ' times!');

var count = 1,
       tM = new TimelineLite(),
       element = $('#boxy');

function log(element){
    console.log('just bounced');
    $(element.target).html('I\'ve bounced: ' + count + ' times!');
    count++;
}

tM.from( element, 2, { top:'-=60px', ease: Linear.easeNone, repeat: -1, onRepeat: log, onRepeatParams: ["{self}"] }, 0 );