0

プログラムは次のことを行う必要があります: ユーザーは右側の入力フィールドに数値を入力し、compute をクリックする必要があります。値は配列にプッシュされます。これはX回行われます。現時点では、X は 5 にハードコードされていますが、それは問題ではありません。

問題は、最後の数値が配列にプッシュされた後、配列の合計が計算され、Web ページに出力されることです。視覚化は問題ではなく、計算が正しいと確信しています。問題は、入力がどのように読み込まれるか、配列に入力されるかだと思います。私はこれについて間違っているかもしれません。

最後に、すべてを計算する関数は compute1 です。編集:実際のエラー:Uncaught TypeError: Cannot read property 'value' of null

これはソースコード全体です：

<!DOCTYPE HTML>
<head>
<title>Asd</title>
    <style>
        .btn{
            width : 30px;
        }
    .btn2{
            width : 100px;
            height : 40px;
        }
    </style>
</head>
<body>
<center>    
    <table>
        <tr>
            <td>Number of elements:</td><td><input type="number" id="textField" class="btn"></input></td>
            <td>Please enter a number.</td> <td><input type="number" id="textFiledInp" class="btn"></input></td>        
        </tr>
    </table>
    <button class="btn2" onclick="compute1()" >compute</button>
    <p id="output"></p>
</center>
</body>
<script>
//var eleNum = parseInt(document.getElementById("textField"));
var eleNum = 5;
var arr = new Array;
function compute1()
{
    console.log("hi");
    if(eleNum > 0)
    {
        eleNum--;
        arr.push(parseInt(document.getElementById("textFieldInp").value));
        console.log(arr[arr.length-1]);
    }
    else{
        var sum = 0;
        for(var i = 0; i < arr.size; i++)
        {
            sum+= arr[i];
        }
        document.getElementById("output").innerHTML = sum;
    }
}
</script>
4

4 に答える 4

1

HTML のタイプミスを修正したら、コードを次のように変更する必要があります。

var eleNum = 5;
var arr = []; //see explanation

function compute1(value) {
    console.log("hi");
    if (eleNum > 0) {
        eleNum--;
        arr.push(parseInt(document.getElementById("textFieldInp").value || 0, 10)); // see explanation
        console.log(arr[arr.length - 1]);
    } else {
        var sum = 0;
        for (var i = 0; i < arr.length; i++) {
            sum += arr[i];
        }
        document.getElementById("output").innerHTML = sum;
    }
}

新しい配列を使用していました。new Array() の代わりに、より良い方法はブラケット表記を使用することです。または、あなたの場合、ユーザーが（入力で）指定した長さに基づいて、またはあなたの要素数を使用して配列を定義することもできます。だろうnew Array(eleNum)。

なぜ|| 0ですか？入力がユーザーによって定義されていない場合 (値が null)、合計が 0 になるため、それ以外の場合は NaN になります。で基数を指定することを忘れないparseIntでください。nnnnnnの回答を参照してください。

これの実用的なフィドルを参照してください。

于 2013-06-13T12:52:09.207 に答える
1

入力の ID が間違っています:

<td>Please enter a number.</td> <td><input type="number" **id="textFiledInp"** class="btn"></input></td>

ID「textFieldInp」の要素を取得しようとします：

document.getElementById("textFieldInp").value);

に変更id="textFiledInp"するid="textFieldInp"と、動作するはずです。

またsize、javascript 配列のプロパティが正しくありません。lengthループでプロパティを使用する必要があります。

宣言した数字の量をプッシュしたい場合はarr、次のように書く必要があります (これがあなたが望むものかどうかはわかりません):

    function compute1()
{
    console.log("hi");
    if(eleNum > 0)
    {
        eleNum--;
        arr.push(parseInt(document.getElementById("textFieldInp").value));
        console.log(arr[arr.length-1]);
    }
    else{
        var sum = 0;
        for(var i = 0; i < arr.length; i++)
        {
            sum+= arr[i];
        }
        document.getElementById("output").innerHTML = sum;
    }
}
于 2013-06-13T12:48:25.480 に答える
0

私が知る限り、あなたの計算は正しいですが、括弧がありませんconsole.log(arr[arr.length-1)

そのはず：

        console.log(arr[arr.length-1]);
于 2013-06-13T12:46:43.193 に答える