Events EaselJS：帮助理解animationend事件

在尝试了解如何从精灵表启动和停止精灵动画时，我尝试了以下方法：

        // other code...

        // define animations in SpriteSheet:
        "animations": {"intro": [0, 19, "false"]}

        // other code...

        var spriteSheet = new createjs.SpriteSheet(data);
        var intro = new createjs.Sprite(spriteSheet, "intro");
        stage.addChild(intro);
        createjs.Ticker.addEventListener("tick", stage);

        intro.stop();

        var btnStart = document.getElementById("btnStart");

        btnStart.onclick = function() {
            console.log("btnStart clicked");
            intro.on("animationend", onStartAnimEnd);
            intro.play();
        };

        function onStartAnimEnd(e) {
            intro.removeEventListener("animationend", onStartAnimEnd);
            console.log("Start anim ended");
        }

在上面的示例中，如果用户单击btnStart按钮，onStartAnimEnd回调将无限期地激发，即使通过在动画配置中定义“false”来表示我们希望在最后一帧停止，动画实际上也停止了，并且我正在移除回调第一行中的事件侦听器

如果我加上：

        function onStartAnimEnd(e) {
            intro.removeEventListener("animationend", onStartAnimEnd);
            intro.stop();
            console.log("Start anim ended");
        }

问题消失了，但这似乎不正确。。。因此，如果我将animationend事件的侦听器分配更改为：

            intro.on("animationend", onStartAnimEnd);

致：

…随着这一变化，不确定事件捕获消失了。因此，我的问题是：

• 这两个事件侦听器分配有什么区别
• 这个animationend事件是否因为我们正在更新tick事件上的舞台而在后台持续触发，即使没有任何东西需要重新渲染

---

谢谢你的时间

这实际上是一个重复的问题。正如我在前面的问题中回答的那样，动画定义是错误的，您需要使用布尔值（

false

），而不是字符串值（

“false”

）

现在确定

ask

是什么，但是上的方法

是
addEventListener
的包装器，您可以在其中指定回调的范围以及回调是否只运行一次。查看API以了解更多信息：


            ask.addEventListener("animationend", onAskAnimEnd);