为什么我的HTML网页无法接收和存储用户输入的内容作为变量数据？

Question

考虑我所拥有的代码：

var g = document.getElementById("al").value;

function start() {
  document.getElementById("test2").innerHTML = typeof(g) + parseFloat(g);
}

<p id="test2">输出在这里：</p>
<form>
  <label for="g">a:</label>
  <input type="number" id="al" name="g" placeholder="输入a" value="55">
  <button onclick="start()" type="button">这里</button>
</form>

当我点击按钮时，我得到的输出是string55，无论用户输入什么。我想修复它并将55替换为用户的实际输入。那么修复方法是什么？

Answer 1

您需要从函数中获取值：

function start() {
  var g = document.getElementById("al").value;
  document.getElementById("test2").innerHTML = typeof(g) + parseFloat(g);
}

<p id="test2">输出在这里：</p>
<form>
  <label for="g">a:</label>
  <input type="number" id="al" name="g" placeholder="输入a" value="55">
  <button onclick="start()" type="button">这里</button>
</form>