显示数字然后删除它的Javascript函数不起作用

Question

我正在尝试制作一个简单的 n-back 游戏（记忆游戏，要求玩家观看一串数字弹出然后离开并将当前数字与以前的数字匹配一定数量的步数）。我正在尝试创建一个简单的函数，它将生成一个随机数，将其添加到字符串中，显示字符串，然后停止显示它并通过从中删除数字来重置字符串。在我能够创建这个函数并让它工作之后，我想用一个 for 循环来循环它。但是，我花了一个多小时试图让这个功能正常工作，但无济于事。见以下代码：

var htmlElement = "#numbers-display";



   /*
    This function generates a random number, adds it to a 
   string, then displays the string in an html element, then turns off the 
   display after a delay, then deletes the number from the string.
   */

function displayNumber() {
  var randomNumber = Math.floor(Math.random()*10);
  var displayNumber = "";
  displayNumber+=randomNumber;
  $("#numbers-display").html(displayNumber);
  window.setTimeout(dump(htmlElement), 2500);
  displayNumber.substr(1);
};

//This function empties the html contents of an element.
function dump(element) {
  $(element).empty();
};

我的部分问题是我似乎永远无法让 setTimeout() 正常工作。我真的不知道为什么。对于这个游戏，我想在短暂的延迟后做很多事情，但 setTimeout 对我来说永远不起作用。无论如何，对于启动和运行它的任何帮助将不胜感激，因为如果我什至无法获得一串随机数来一个接一个地显示，我什至无法开始构建这个游戏的其他部分。请记住，我是一个完全新手，仍然很难完成最基本的事情。

Answer 1

您可能希望使用此代码改进一些事情，但要回答您的问题，setTimeout 需要一个回调和一个时间（毫秒），之后应该调用回调。您将立即调用dump 并将返回值传递给setTimeout。

我已经（最低限度地）在下面编辑了您的代码以实现所需的行为。

您可能还想考虑substr 不会改变原始字符串，而是返回一个新字符串，因此您在displayNumber 中使用它没有任何效果。

var htmlElement = "#numbers-display";



   /*
    This function generates a random number, adds it to a 
   string, then displays the string in an html element, then turns off the 
   display after a delay, then deletes the number from the string.
   */

function displayNumber() {
  var randomNumber = Math.floor(Math.random()*10);
  var displayNumber = "";
  displayNumber+=randomNumber;
  $("#numbers-display").html(displayNumber);
  window.setTimeout(function () {
    dump(htmlElement);
  }, 2500);
  displayNumber.substr(1);
};

//This function empties the html contents of an element.
function dump(element) {
  $(element).empty();
};

displayNumber();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="numbers-display"></div>

Answer 2

@Damon 的回答是完全正确的，但如果你不想用冗长的函数环绕dump(htmlElement);，你可以使用bind method

尝试：

setTimeout(dump.bind(this, htmlElement), 2500);