将 as3 btn 代码转换为 Javascript答案

【问题标题】：Converting as3 btn code to Javascript将 as3 btn 代码转换为 Javascript
【发布时间】：2015-05-08 04:35:07
【问题描述】：

我正在尝试使用 javascript 将 flash as3 文件转换为 canvas html5 doc。

我将如何转换下面的代码？

nex.addEventListener(MouseEvent.CLICK, onClickHandler);

function onClickHandler(myEvent:MouseEvent)
{
    SoundMixer.stopAll();
    MovieClip(parent).nextFrame();
}

我现在正在尝试的 javascript 尝试。

this.nex.onClick = function(){

 exportRoot.play();

}

感谢您的帮助！

【问题讨论】：

没有onClick事件，有onclick事件。
感谢我将“C”修复为“c”...仍然没有成功，让它进入根目录并播放下一帧。
控制台有错误吗？ this.nex 是什么？ exportRoot 是什么？你需要做一个运行的例子。
nex 是我在 Flash 中的按钮实例的名称。 exportRoot 是我发现的一些代码，我认为它可以让你回到根级别。
好吧 nex 应该是对 DOM 的对象引用。而 exportRoot 在 JavaScript 中什么都不是，除非你包含了一些框架。

标签： javascript html actionscript-3 html5-canvas flash-cc

【解决方案1】：

我并不是想学究气，但您的问题可能不像将 ActionScript 3.0 转换为 JavaScript 那样简单。 AS3 在很大程度上是 JavaScript 的超集（参见 ECMAcSript 4），因此将“向下”转换为 JavaScript 很容易：

nex.addEventListener(MouseEvent.CLICK, onClickHandler);

function onClickHandler(myEvent)
{
    SoundMixer.stopAll();
    MovieClip(parent).nextFrame();
}

看起来几乎一样，对吧？你刚刚删除了myEvent 上的MouseEvent 类型声明，因为类型声明是ECMAScript 4 的一个特性，它从未进入JS（很遗憾）。

真正的问题是浏览器 API 和 Flash Player API 非常不同。即使它们可能相似，它们也不一定在所有浏览器中都相似。现在公平地说，我认为这确实是您最初的问题，我只是想指出，前进的道路需要了解很多关于 Flash Player 功能和浏览器功能之间的差异，因为这是大部分工作的内容。语法的实际转换应该不会太难。

回到你的例子，这里有一些不同之处需要指出：

1) 虽然addEventListener() 是一种有效的浏览器方法（与评论者所说的相反），但IE8 等旧版浏览器不支持它。在这种情况下，您可以使用attachEvent()，作为最后的后备，您可以使用DOM 回调onClick。 More explanation here.

2）虽然MouseEvent在浏览器中以一种或另一种形式存在，但JS中没有静态常量，所以你不会找到浏览器定义的MouseEvent.CLICK之类的东西。相反，您只需使用字符串"click"。

3) SoundMixer 是 Flash Player 的一项功能。它在浏览器中最接近的等价物是HTML5 audio。这里有很多不同之处，在浏览器中制作音频并非易事，而且您根本不会拥有与 Flash Player 声音 API 相同的功能。我会寻找一个让浏览器音频更易于使用的库。

4) MovieClip 是 Flash Player 的一项功能。浏览器中没有类似的东西。对于如何在浏览器中重新创建类似时间线的东西，这里真的没有简单的答案，但是像 CreateJS（由 Flash 用户创建）这样的库或像 Adobe Edge Animate 这样的工具，或者使用 Adobe Flash Pro's own HTML output features 可能会帮助你重新- 为浏览器创建东西。

编辑：啊哈，我不清楚你的问题，但既然你标记了这个 [flash-cc]，听起来你已经在使用 Adobe Flash Pro CC 的 HTML Canvas 文档了？在这种情况下，以上所有内容仍然适用，但除此之外，您将能够使用 Flash Pro 的时间轴 JS 库。这是 CreateJS 和 Adobe 创建的一些额外东西的组合，用于模拟浏览器中的许多 Flash Player 时间线行为，浏览器没有内置时间线。有关此内容的更多信息，我将从这里开始：https://helpx.adobe.com/flash/using/creating-publishing-html5-canvas-document.html

【讨论】：

【解决方案2】：

这是现在在 html5 flash 项目中用于按钮的正确代码

this.Next.addEventListener("click", fl_ClickToGoToAndStopAtFrame_7.bind(this));

function fl_ClickToGoToAndStopAtFrame_7() {

    this.gotoAndStop(1);

}

【讨论】：