Question

我创建了这个函数，它接受一个字符串并将其分成div字母，然后单击div中的任意位置，它会清除所有文本并逐个字母地开始下一个字符串（就像旧的一样）每当一个角色谈论时，gameboy游戏文本框）。唯一的问题是如果在函数完成之前单击div，键入当前字符串，它将不会跳到下一个字符串，它将只清除div并在它被截断之前继续字符串。我试着把它带到哪里如果你在完成之前点击它键入当前字符串的数组它不会使用超时做任何事情，但它只将它应用于第一个字符串。所以相反，我试图让它跳到下一个字符串，而不是完成当前的字符串，但我认为因为字符串被分成一个数组，我不能这样做？

基本上只想把它放到哪里如果你从var b数组中点击一个字符串的中间：它没有做任何事情，跳过显示整个字符串，跳到下一个字符串。

//JavaScript file

var x = "";
var output = document.getElementById('output');
var a = 0;
var b = ["Hello", "My name is Colin", "I am an entry level web developer!"]
var c = b[a];
a++;

function text(x) {
  var x;
  var string = x;
  var stringArray = string.split("");
  var arrayLength = stringArray.length;
  //	var arrayFinal = stringArray[stringArray.length - 1]
  var r = 0;

  setInterval(function nextLetter() {
    if (arrayLength > 0) {
      output.innerHTML += stringArray[r]
      r++
      arrayLength--
    }
  }, 50); //end interval

  setTimeout(function() {
    output.onclick = function() {
      output.innerHTML = ""
      text(b[a])
      a++
    }
  }, 50 * arrayLength); //end timeout

} //end function

text(c)

/* Cascading Style Sheet */

* {
  font-size: 16px;
  font-family: "Times New Roman", Times, serif;
}

  <div id="output"></div>

这是练习，所以提示非常感谢！仍在尝试学习语法等基础知识

Answer 1

clearInterval和clearTimeout

你遇到空字符串问题：

function text(x) {
   var stringArray = (typeof x === 'string' || x instanceof String)?x.split(""):[];

最小变化：

＆＃13;

//JavaScript file

var output = document.getElementById('output');
var a = 0;
var b = ["Hello", "My name is Colin", "I am an entry level web developer!"]
var c = b[a];
a++;
var tId, iId;
function text(x) {
  var stringArray = (typeof x === 'string' || x instanceof String)?x.split(""):[];
  var arrayLength = stringArray.length;
  //	var arrayFinal = stringArray[stringArray.length - 1]
  var r = 0;
  clearInterval(iId);
  iId= setInterval(function nextLetter() {
    if (arrayLength > 0) {
      output.innerHTML += stringArray[r]
      r++
      arrayLength--
    }
  }, 50); //end interval
  clearTimeout(tId);
  tId=setTimeout(function() {
    output.onclick = function() {
      output.innerHTML = ""
      text(b[a])
      a++
    }
  }, 50 * arrayLength); //end timeout

} //end function

text(c)

＆＃13;

/* Cascading Style Sheet */

* {
  font-size: 16px;
  font-family: "Times New Roman", Times, serif;
}

＆＃13;

<div id="output"></div>

＆＃13;

复古文本框问题

1 个答案: