javascript onclick function is not working

Question

i tried this code in vs 2017 but it is not working. i cant console the total and other text variables but i am unable to populate the results in the text box.

 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

Use value instead of innerHTML on your result input. Because input elements doesn't have innerHTML

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

innerHTML means HTML between starting and ending tag of element.As <input> elements doesn't have closing tag so it has no innerHTML

Answer 2

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

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