HTML Canvas，如何在收到点击画布之前停止程序？答案

【问题标题】：HTML Canvas, How to stop program until click on canvas is received?HTML Canvas，如何在收到点击画布之前停止程序？
【发布时间】：2015-02-20 00:39:19
【问题描述】：

我目前正在开发一款 HTML Canvas 游戏。没有外部依赖。它涉及 HTML 元素画布，几乎没有其他内容。游戏没有主动换屏，因为它是一个商业模拟器。我对游戏开发或编程并不陌生，但我对 Canvas 游戏编程并不陌生。我的问题是我想通过没有外部元素的画布做所有事情。我在画布中制作了自己的按钮，并试图仅在单击程序后检查单击的注册位置，因为我不希望游戏在没有单击的情况下不断检查鼠标位置。事件侦听器是否仅在 JavaScript 仍在运行时才起作用？无论如何要在主游戏循环中编写类似于伪代码的内容

while !exit
     if(input)
        update();
        render();

事件监听器是不是像这样显式工作，还是我必须像这样写

while !exit sleep(16.67); 在这种情况下，事件侦听器只是主动检查输入，但不是显式地检查输入，并使用一个在收到点击时更新的函数？

这就是画布的工作原理吗？只要程序正在运行，事件侦听器会不断检查吗？

任何有关如何执行此操作的反馈将不胜感激。我愿意回答任何进一步的问题以帮助找到答案。谢谢。

【问题讨论】：

“事件监听器是否仅在 JavaScript 仍在运行时才起作用？” – 不。 JavaScript（在任何正常情况下）一开始就不是“持续运行”的。 “无论如何要在主游戏循环中写入 [...]” - 不，这样的循环一开始是错误的方法，它会阻止与页面的任何交互（一段时间，然后浏览器会询问用户是否要中止这个长时间运行和阻塞的脚本）。我认为您需要研究更多关于如何在网页上下文中使用 JS 和事件的基础知识，您的问题实在是太宽泛了。

标签： javascript html canvas

【解决方案1】：

JavaScript 不需要循环来监听事件。所以游戏循环对于像这样没有主动渲染的游戏是没有用的。我被引导相信事件侦听器不起作用，因为我使用了语法canvas.addEventListener("click", onClick());

这样不行，因为如果你特意在函数名后面写括号，就是调用函数，并没有添加事件监听器。

因此，对于这样的游戏，您可能希望将事件侦听器（不带括号）挂接到更新函数，而不是使用循环。

【讨论】：