如何: Adobe Animate - gotoAndStop()；在按钮上单击

Question

我在.fla中创建了一个导出到.swf的项目，但我现在需要它为HTML5格式。因此，我更改了文件转换类型，现在要求将我的ActionScript3转换为JavaScript。但是，这不是我的强项。

我目前正在尝试：

this.stop();

this.close1_btn.addEventListener("click", function (closebtn)
{
this.gotoAndPlay(1);
});

this.store1_btn.addEventListener("click", function (store1_btn)
{
this.gotoAndPlay(11);    
});

this.store2_btn.addEventListener("click", function (store2_btn)
{
this.gotoAndPlay(12);
});

this.store3_btn.addEventListener("click", function (store3_btn)
{
this.gotoAndPlay(13);    
});

概述:尝试侦听符号，例如close1_btn的点击。单击时，它将链接到指定的帧并在其处停止。

我预计会有一些错误*可能是在function ()部分附近？

这是一个相当简单的地图，所以对于知道他们在看什么的人来说，应该不会太难！非常感谢你所能给予的任何帮助！

Answer 1

我认为问题出在函数作用域上，这是一个常见的错误。

addEventListener方法没有隐含的作用域，因此函数将在window上调用。如果在单击这些按钮时在控制台中输出this，您可能会看到Window。要解决此问题，您可以：

绑定您的方法(docs)的

示例：

this.close1_btn.addEventListener("click", function (closebtn)
{
this.gotoAndPlay(1);
}.bind(this));

1. 使用带第三个参数(docs)

的CreateJS on快捷方式

示例：

this.close1_btn.on("click", function (closebtn)
{
this.gotoAndPlay(1);
}, this);

一个重要的注意事项是，如果再次播放第0帧，该帧脚本将再次运行，每次都会向每个按钮添加另一个侦听器，从而导致在单击按钮时多次调用这些函数。我推荐这样的东西：

if (!this.inited) {
  // Your code

  this.inited = true;
}

Answer 2

感谢您的回复。

我现在正在使用您提供的代码：

this.stop();

if (!this.inited) {
  // Your code


this.close1_btn.addEventListener("click", function (closebtn)
{
this.gotoAndPlay(1);
}.bind(this));

this.store1_btn.addEventListener("click", function (store1btn)
{
this.gotoAndStop(11);
}.bind(this));


this.inited = true;
}

但是，我在输出中得到了如下结果

警告: EaselJS中的帧号从0开始，而不是从1开始。例如，这会影响gotoAndStop和gotoAndPlay调用。(5)如果从本地文件系统运行，包含位图和按钮的内容可能会在某些浏览器中生成本地安全错误。

如果您能给我们任何进一步的建议，我们将不胜感激。

Answer 3

为您的持续帮助干杯！

在浏览器中打开时预览不起作用，是不是因为我没有完全导出并在线托管它？

这样我就可以忽略这些错误了？

^^如果这一切都清楚了。你有没有推荐的方法将其导出并托管在网页上？

再次感谢你，朋友，谢谢！