如何使用 DOM 和 JavaScript 在游戏的 3 个不同级别之间切换？例如简单、中等和困难

Question

我正在尝试使用 DOM 和 JavaScript 制作一个简单的游戏，在这个游戏中我有 3 个不同的级别：简单、中等和困难。默认情况下，当页面加载时，使用简单级别！但我希望能够使用 javascript 在 3 个不同级别之间切换！

可以使用 javascript cookie 会话来完成此操作，因此当单击按钮时将使用/激活特定功能，然后使用该功能直到用户单击另一个按钮（例如中等级别）。

例如：

function easylevel() {
}

function mediumlevel() {
}

function hardlevel() {
}

因此，通过单击按钮，上述任何功能都会被激活并存储到 cookie 会话中，例如：

<input type="button" onclick="easylevel()" value="Easy Level" />
<input type="button" onclick="mediumlevel()" value="Medium Level" />
<input type="button" onclick="hardlevel()" value="Hard Level" />

我已经尝试过这个，但它不起作用，有人可以解释一下我哪里出了问题吗？ ！我200%确定我错了，因为我对JS了解不多，所以肯定需要帮助和建议！

Answer 1

如果你想要的是重复调用一个函数，那么你可以使用 setInterval

<script>
var intervalInMilliseconds = 1000; // change this to watever value you like
var activeInterval = undefined;
function startEasyLevel() {
    if (activeInterval) {
         clearInterval(activeInterval);
    }
    activeInterval = setInterval(easylevel, intervalInMilliseconds);
}
function startMediumLevel() {
    if (activeInterval) {
         clearInterval(activeInterval);
    }
    activeInterval = setInterval(mediumlevel, intervalInMilliseconds);
}
function startHardLevel() {
    if (activeInterval) {
         clearInterval(activeInterval);
    }
    activeInterval = setInterval(hardlevel, intervalInMilliseconds);
}
</script>

<input type="button" onclick="startEasyLevel()" value="Easy Level" />
<input type="button" onclick="startMediumLevel()" value="Medium Level" />
<input type="button" onclick="startHardLevel()" value="Hard Level" />

添加你当前级别的函数，它应该每秒调用该函数。一旦您单击其中一个按钮，它将停止调用当前级别的函数，并继续调用与单击的按钮关联的函数。

如果你想默认加载某个关卡，你可以使用 window 元素的 onload 事件：

window.onload = startEasyLevel;