Question

正如标题所示，我希望每个字母进入输入字段，使用while循环显示在新行上。例如，如果有人在输入框中输入“cat”，则会返回：

C

一

吨

这是我到目前为止所做的，但目前它只显示第一个字母。

 var input = document.getElementById('userinput').value;
  var i  = input.length;
  while (i--) {
    document.getElementById('message').innerHTML = (input[i]);
  }

Answer 1

该行：

document.getElementById('message').innerHTML = (input[i]);

完全覆盖#message元素的HTML，因此它只有最后一次迭代的值。相反，你会想要做：

document.getElementById('message').innerHTML += (input[i]) + "<br />";

<br />移动到新行。要以自上而下的方式使用它，您可能需要使用正常的for循环：

for(var i = 0; i < input.length; i++)
    document.getElementById('message').innerHTML += input[i] + "<br />";

以下是一个基本的代码段示例（点击进入或取消对焦将触发事件）：

document.getElementById('text').addEventListener("change", function(){
  document.getElementById('message').innerHTML = "";
  input = document.getElementById('text').value;
  for(var i = 0; i < input.length; i++)
      document.getElementById('message').innerHTML += input[i] + "<br />";
});

<input id="text" type="text" />
<div id="message"></div>

每个输入字母都在单独的行

1 个答案: