javascript - 原生JavaScript中的动画输入

我尝试创建动画打字/擦除效果。它可以键入，但是当它结束第一句话时，它什么也没做。似乎它卡在了第一个if语句中。

window.onload = () => {
  const sentences = ['Who am I?', 'Who are you?', 'Who are we?'];
  const input = document.getElementsByName('q')[0];

  let sentence = 0;
  let character = 0;
  let typing = true;

  (function typing() {

    if (character === sentences[sentence].length - 1) {
      typing = false;
    } else if (character === 0) {
      if (sentence < sentences.length - 1) {
        sentence++;
      } else {
        sentence = 0
      }
      typing = true;
    }

    if (typing) {
      character++;
    } else {
      character--;
    }

    input.placeholder = sentences[sentence].substring(0, character);

    setTimeout(typing, ~~(Math.random() * (300 - 60 + 1) + 60));
  })();

};

最佳答案

您在函数本身中覆盖了函数，setTimeout接收布尔值作为第一个参数

对于函数名称，最好使用typeSentence这样的动词
对于布尔型，使用诸如isTyping之类的问题是件好事

关于javascript - 原生JavaScript中的动画输入，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38305952/