关于简单的Javascript / HTML的问题

Question

I have been teaching myself some Javascript; 我一直在教自己一些Javascript; and I am having trouble getting this function to run properly. 我无法正常运行此功能。 This is what is being output. 这就是输出。

Answer: [object HTMLInputElement][object HTMLInputElement] 答案：[object HTMLInputElement] [object HTMLInputElement]

 function addNumbers() { var firstNum = document.getElementById("num1"); var secondNum = document.getElementById("num2"); result = firstNum + secondNum; document.getElementById("demo").innerHTML = "Answer: " + result; return result; }

 <!DOCTYPE html> <html> <head> <!-- ,<script src="scripts.js"></script> --> </head> <body> <h2>JavaScript Functions</h2> <p>This example calls a function which performs a calculation and returns the result:</p> <form> First Number<br> <input type="text" name="firstNum" id="num1"><br> Second Number<br> <input type="text" name="secondNum" id="num2"><br> <input type="button" value="Add!" onclick="addNumbers()"> </form> <p id="demo"></p> </body> </html>

Answer 1

Like the comments said, get the value from the HTML element node and parse it into a float 就像评论所说的那样，从HTML元素节点获取值并将其解析为float

var firstNum = parseFloat(document.getElementById("num1").value);
var secondNum = parseFloat(document.getElementById("num2").value);

 function addNumbers() { var firstNum = parseFloat(document.getElementById("num1").value); var secondNum = parseFloat(document.getElementById("num2").value); result = firstNum + secondNum; document.getElementById("demo").innerHTML = "Answer: " + result; return result; }

 <!DOCTYPE html> <html> <head> <!-- ,<script src="scripts.js"></script> --> </head> <body> <h2>JavaScript Functions</h2> <p>This example calls a function which performs a calculation and returns the result:</p> <form> First Number<br> <input type="text" name="firstNum" id="num1"><br> Second Number<br> <input type="text" name="secondNum" id="num2"><br> <input type="button" value="Add!" onclick="addNumbers()"> </form> <p id="demo"></p> </body> </html>

关于简单的Javascript / HTML的问题

问题描述

1 个解决方案

解决方案1
4 已采纳 2019-03-11 23:30:15

关于简单的Javascript / HTML的问题

问题描述

1 个解决方案

解决方案1 4 已采纳 2019-03-11 23:30:15

解决方案1
4 已采纳 2019-03-11 23:30:15