javascript onclick功能不起作用

Question

我在2017年尝试了这个代码，但它没有用。我无法控制总文本和其他文本变量，但我无法在文本框中填充结果。

function myFunction1() {

  var text1 = document.getElementById("txt1").value;
  console.log(text1)
  var text2 = document.getElementById("txt2").value;
  var text3 = document.getElementById("txt3").value;
  var text4 = document.getElementById("txt4").value;
  var total1 = parseFloat(text1) + parseFloat(text2) + parseFloat(text3) + parseFloat(text4);
  console.log(total1)

  document.getElementById("txt1").innerHTML = total1;
}

<input type="text" id="txt1" />
<input type="text" id="txt2" />
<input type="text" id="txt3" />
<input type="text" id="txt4" />
<input type="text" id="total" />

<input type="submit" onclick="myFunction1()" />

Answer 1

在结果输入上使用value而不是innerHTML。因为输入元素没有innerHTML

document.getElementById("monthlyAmount").value = total1

innerHTML表示元素的开始和结束标记之间的HTML。因为<input>元素没有结束标记所以它没有innerHTML

Answer 2

您应该使用value来设置输入中的文本：

document.getElementById("monthlyAmount").value = total1;