jQuery技术:动画HTML5canvas – 事件监听器不止一次触发？

所以我对javascript（以及一般的编码）非常陌生，我已经设法在Animate CC中制作了一个令人难以置信的基本HTML5canvas。 唯一的问题是，当我回到前一帧时，按钮会重复。

流程：

当移回到前一帧时，按钮会触发两次（即控制台日志消息触发两次）。 如果我重复这个过程并移动到下一帧并再次返回第三次，它将触发三次。

我已经注意到这个post了： 为什么我的事件监听器不止一次触发？

这和我遇到的问题完全相同。 但不幸的是，这个答案是针对as3而我不知道如何为javascript更改它。 我一直在努力研究几天，但我真的不明白:(

任何人都可以帮助我，或者你能指出我正确的方向来了解这一点吗？

谢谢！

码：

第1帧：

instance = this; instance.stop(); instance.messageBTN.on("click", messageTest); function messageTest(){ console.log("Button Pressed") } instance.nextBTN.addEventListener("click", nextFrame); function nextFrame(){ instance.gotoAndStop(1); } 

第2帧：

 instance = this instance.backBTN.addEventListener("click", previousFrame); function previousFrame(){ instance.gotoAndStop(0); } 

示例文件： https ： //wetransfer.com/downloads/0eb9e342cc093fff59645626b9e2fd1e20170308205102/3bafa6

 instance.stop(); //MAKE SURE ALL BUTTONS ARE EVENT LISTENERS instance.messageBTN.addEventListener("click", messageTest); function messageTest(){ console.log("Button Pressed"); } instance.nextBTN.addEventListener("click", nextFrame); function nextFrame(){ instance.gotoAndStop(1); //ADD IN TO REMOVE THE EVENT LISTENER WHEN MOVING TO ANOTHER FRAME instance.messageBTN.removeEventListener("click", messageTest); } 

 var eventLisBool = false; 

 if (!eventLisBool) { // code... // and at the end of your listener code, include this: eventLisBool = true; } 

以上就是jQuery教程分享动画HTML5canvas – 事件监听器不止一次触发？相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。