javascript - 使用 setTimeout 的函数在后续调用中抛出

Question

我正在尝试一些简单的东西，一种打字效果：

var i = 0;
var txt = "eco eco"
var speed = 1;
function typeWriter(idtxt) {
  if (i < txt.length) {
    document.getElementById(idtxt).innerHTML += txt.charAt(i);
    i++;
    setTimeout(typeWriter, speed);
  }
};

<button class="remo-btn" onclick="typeWriter('demo')">
<p id="demo"></p>

当我对 id 进行硬编码时，代码按预期工作：

document.getElementById("demo").innerHTML += txt.charAt(i);

但是当我像这样传递 id 时：

document.getElementById(idtxt).innerHTML += txt.charAt(i);

它只返回第一个字母，在本例中为“e”（来自echo）。

有人可以帮助我吗？

标签： javascripthtmlfunctionsettimeout

Answer 1

idtxt您在调用typeWriter时忘记传递setTimeout：

var i = 0;
var txt = "eco eco"
var speed = 1000;
function typeWriter(idtxt) {
  if (i < txt.length) {
    document.getElementById(idtxt).innerHTML += txt.charAt(i);
    i++;
    setTimeout(() => typeWriter(idtxt), speed);
  }
};

<button class="remo-btn" onclick="typeWriter('demo')">
<p id="demo"></p>