為什麼我的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>