1

私は現在、javascript を使用して、ユーザーが入力ボックスから複数の数字を入力できるページを作成する必要がある学校のプロジェクトを行っています。

各数値が入力されると追加ボタンが表示され、入力の下の別のボックスに数値が表示されます。したがって、各数値はページの垂直方向に表示されます。

そこから、さらに 2 つのボタンが必要になります。計算する最初のものは、数値を合計して平均を計算します。2 つ目は、アレイをクリアして再起動します。

最後の 2 つのボタンで問題ないと思います。私が確信していないのは、ユーザー入力が動的配列をどのように作成し、それがページに表示されるかです。単一の数値入力を取得できましたが、次のステップが欠落しているため、入力された次の数値が表示され、計算を実行できる配列を作成できます。

4

2 に答える 2

0

最も簡単な方法は、最初の入力から更新された配列を維持しようとするのではなく、数値を示す入力をループして各数値を追加することです。

を使用して表示input要素をコンテナに貼り付けるとid、次のような簡単なことができます。

var container = document.getElementById("container-id"),
    inputs = container.children,
    total;

for (var x = 0, y = inputs.length; x < y; x++) {
    total += parseInt(inputs[x].value, 10);
}

alert(total) //do something way better than alert!
于 2012-10-15T10:54:19.950 に答える
0

効果があると思いますので是非お試しください

ジャバスクリプト：

    <script type="text/javascript">
    var arr = new Array();
    function addNum()
    {
    var temp = document.getElementById('a').value;
    arr.push(temp);
    document.getElementById('a').value = "";
    getAvg();
    }

    function getAvg()
   {
    var sum = 0;
    for(var i = 0; i < arr.length; i++){
        sum += parseInt(arr[i]);
    }

    var avg = sum/arr.length;

    document.getElementById('sum').value = sum;
    document.getElementById('avg').value = avg;


      }

function clearAll()
{
    arr.length = 0;
    document.getElementById('a').value = "";
    document.getElementById('sum').value = "";
    document.getElementById('avg').value = "";
}
</script>

HTML:

       <table>
        <tr><td><input type="text" id="a"></td>
        <td>Sum :<input type="text" id="sum"></td>
        <td>Avg :<input type="text" id="avg"></td></tr>
      <tr><td><input type="button" value="add" onclick="addNum()"></td>
      <td><input type="reset"  value="reset" onclick="clearAll()"></td></tr>

     </table
于 2012-10-15T11:20:14.870 に答える