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需要回调和时间（ms），之后应调用回调。您正在立即调用dump并将返回值传递给setTimeout。

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

您可能还需要考虑substr不会改变原始字符串，而是返回一个新字符串，因此您在displayNumber中使用它不起作用。

＆＃13;

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();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="numbers-display"></div>

＆＃13;

Answer 2

@Damon的答案是完全正确的，但是如果你不想要一个详细的功能回绕dump(htmlElement);，你可以使用bind method

尝试：

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

Javascript函数显示一个数字然后删除它将无法正常工作

2 个答案: