Javascript：2 个用户输入值的平均值答案

【问题标题】：Javascript: Average of 2 user input valuesJavascript：2 个用户输入值的平均值
【发布时间】：2017-11-03 02:47:04
【问题描述】：

对于这个基本问题，我深表歉意，但我长期以来一直在努力使这项工作正常进行，但我似乎无法让这段代码返回一个值。

我很尴尬地承认我已经尝试了多长时间，以及我看过多少相关的 StackOverflow 问题，但是，没有一个像我的代码那么简单，当我试图做一些更接近于我的看起来，它只是不会提醒任何东西。

思路如下：

用户输入2个数字，
点击按钮，
并被告知他们输入的数字的平均值。

无论我进行了多少次迭代，我的警报都是 NaN。我真的可以使用一些建议。提前致谢！

<html>
	<head>
		<title> Javascript </title>
	<body>
		<p> Enter two number for an average below </p>
		<p> Number 1<input type="text" id="userInput1"></input></p>
    	<p> Number 2<input type="text" id="userInput2"></input></p>
    	<button id="averageButton"> Calculate</button>
   
    <script type="text/javascript">
    	function average(a, b) {
    		return ((a + b) /2);
    	}

    	document.getElementById("averageButton").onclick = function (){
   	 		var a = document.getElementById("userInput1").value;
			var b = document.getElementById("userInput2").value;    		
    		alert(average());
		}
	</script>
    </body>

</html>

【问题讨论】：

您需要传递变量a 和b 以获得所需的结果。意思是，alert(average(a, b)); 正在发生的事情是该函数需要两个变量，然后它将对其执行一些操作 - 但由于您不传递变量，它不知道 a 和 b 在该函数的上下文。因此，你的 NaN
...以及parseInt 或parseFloat 的值e

标签： javascript html numbers average

【解决方案1】：

您未能将数字 a、b 传递给您的函数 - 一个简单的错误。

但由于输入被视为字符串，您还需要将它们转换为数字 a*1

查看注释代码

<html>
	<head>
		<title> Javascript </title>
	<body>
		<p> Enter two number for an average below </p>
		<p> Number 1<input type="text" id="userInput1"></input></p>
    	<p> Number 2<input type="text" id="userInput2"></input></p>
    	<button id="averageButton"> Calculate</button>
   
    <script type="text/javascript">
    	function average(a, b) {
    		// force the input as numbers *1
        return ((a*1 + b*1) /2);
    	}

    	document.getElementById("averageButton").onclick = function (){
   	 		var a = document.getElementById("userInput1").value;
			var b = document.getElementById("userInput2").value;    		
    		// pass the numbers to the average function!
        alert(average(a,b));
		}
	</script>
    </body>

</html>

【讨论】：

【解决方案2】：

乍一看，您可能需要将输入值从字符串转换为浮点数，然后将它们实际传递给平均函数。

【讨论】：

【解决方案3】：

您可能希望将输入更改为 <input type="number"> 防止用户添加非数字值。

其次将您的输入解析为document....value 返回字符串，

var a = parseFloat(document.getElementById("userInput1").value);
var b = parseFloat(document.getElementById("userInput2").value);

如果您这样做，您就不必处理a*1 的有趣业务。

  // force the input as numbers *1
    return ((a*1 + b*1) /2);

此块不是必需的，因为将字符串与数字相乘会返回 NaN 值。

【讨论】：