Mengapa halaman HTML saya tidak boleh menerima dan menyimpan input pengguna sebagai data berubah-ubah?

Question

Pertimbangkan kod yang saya ada:

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>

Apabila saya mengklik butang, output yang saya dapat ialah string55, tidak kira apa yang dimasukkan oleh pengguna. Saya mahu membetulkannya dan menggantikan 55 dengan input sebenar pengguna. Jadi apa penyelesaiannya?

Answer 1

Anda perlu mendapatkan nilai daripada fungsi:

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>