如何将用户输入存储为 JavaScript 变量以供以后使用答案

【问题标题】：How to make user input stored as JavaScript Variable for later use如何将用户输入存储为 JavaScript 变量以供以后使用
【发布时间】：2020-04-07 12:32:39
【问题描述】：

我正在尝试编写一个程序，该程序允许用户键入输入，然后按下按钮并打印输入。我似乎无法让 JavaScript 保存用户输入。我认为这与文本输入字段的 value 属性没有更新有关，因此 JavaScript 无法检索它。我不知道如何解决这个问题，因此无法查看这是否是导致问题的原因。任何帮助将不胜感激。

var n = document.getElementById('userInput').value;

function runCode() {
  document.getElementById('test').innerHTML = n;
}

<input type="text" id="userInput">
<button type=button id="btn" onclick="runCode()">Click Me!</button>
<p id="test">Orginal Text</p>

【问题讨论】：

关于不更新的部分你是对的。您当前正在页面加载时读取输入值一次。当然，当时用户还没有机会输入任何内容。只需读取runCode 函数中的输入值即可解决此问题。

标签： javascript input var

【解决方案1】：

由于您在页面加载时取值，因此该值为空，您应该在点击处理函数中取值。

请注意：如果值是纯字符串（不是 htmlString）而不是innerHTML，最好使用元素的textContent 或innerText 属性。

<input type="text" id="userInput">
<button type=button id="btn" onclick="runCode()">
  Click Me!
</button>
<p id="test">
  Orginal Text
</p>
<script>
  //console.log(document.getElementById('userInput').value == "") // true
  function runCode() {
    var n = document.getElementById('userInput').value;
    document.getElementById('test').textContent = n;
  }
</script>

【讨论】：

【解决方案2】：

您在 JS 执行开始时引用输入的值，它将具有输入的初始值，即空字符串。

试着把这个 var n = document.getElementById('userInput').value;函数内部

【讨论】：