Question

使用文本框，我需要用户能够输入他们希望找到平均值的数字，每个数字用空格分隔。

以下是文本框的HTML：

<input type="text" id="average" onchange="findAverage()" />

我知道我需要使用arguments对象来获得平均值。

从这里开始，我很迷茫。好像我应该首先将文本框输入转换为数组，然后拆分＆＃34; ＆＃34; ？我非常失落，并希望得到任何帮助！我到目前为止所获得的功能如下：

function findAverage(nums) {
  nums = document.getElementById("average").value;
  nums = nums.split(" ");

  for (var i=0, total = 0, len=arguments.length; i<len; i++) {
    total += arguments[i]; 
  } 
  document.getElementById("averageReturn").innerHTML = total / arguments.length;   
}

我一直在阅读使用arguments对象时可以找到的所有内容，我真的不理解它。

（如果有人能想出更好的方式来询问这个问题，请随时编辑这个问题，以便让其他用户更好/更清楚！）

Answer 1

您的解决方案并不遥远，但使用onchange HTML属性可能会让您的生活变得困难。 <{1}}局部变量和arguments参数都与您的案例无关。

我会改用nums方法。这更容易阅读，并且在更改输入值时，可以轻松获得它。这样的事情（Plunker）：

addEventListener

请注意，当使用function findAverage() { // grab the value, split on whitespace, parse into numbers var nums = this.value.split(' ').map(parseFloat); // compute total for (var i = 0, total = 0, len = nums.length; i < len; i++) { total += nums[i]; } // compute average and write to output element document.getElementById("averageReturn").innerHTML = total / len; } // add change listener document .getElementById('average') .addEventListener('change', findAverage, false);绑定findAverage时，在函数内部，addEventListener引用目标元素，this保存该元素的当前值。 / p>

Answer 2

阅读评论后你好：

<input type="text" id="average" onchange="findAverage(this.value)" />

是你想要的。

我在您的代码中看到的两个问题是：

您使用arguments代替nums。 nums是您创建的数字数组。 javascript函数中的FYI arguments是包含所有参数的对象。
nums.split(" ");的拆分结果是一个字符串数组。您可能想使用Number()

Answer 3

上面提供的解决方案很好，但并没有完全解决问题。允许用户生成的值作为参数传递的缺少组件是apply（）函数。 apply函数允许您使用数组文字作为参数。这是工作解决方案

function findAverage2() {
    //code
    nums = document.getElementById("average").value;
    nums = nums.split(" ");
    for (i = 0; i < nums.length; i++) {
      nums[i] =parseInt(nums[i]);
    }
    //With apply, you can use an array literal as parameter arguments
    findAverage.apply(null, nums);   
  }

使用参数对象

3 个答案: