Question

我需要的是当我输入数字到textarea时，我需要它来得到每一行的总和。

Textarea上输入的行示例：

10 10 10
99 11
11 11

我得到每行总和的Div的例子

30
110
22

我有一个脚本，但只显示警告结果。我不知道怎么做，所以它会在div上显示所有结果。现在div只显示最后一行的结果。

$('#sub').click(function() {

   var grandTotal = 0,
       rowTotals = [], // array to hold individual row totals
       rowData,
       rows,
       val,
       rawData = document.getElementById('nums').value;

   // if desired replace this comment with regex validation of rawData

   rows = rawData.split("\n");

   for (var i=0; i < rows.length; i++) {
      rowTotals[i] = 0;
      rowData = rows[i].split(" ");
      // if you need to test that each row has the same number
      // of values in it do that here

      for (var j=0; j < rowData.length; j++) {
         val = parseFloat(rowData[j]);
         // add validation of val here
         rowTotals[i] += val;
      }

      alert("Total for row " + (i + 1) + ": " + rowTotals[i]);
        // ALERT SHOWS RESULT FOR EVERY LINE

$('#res').html(rowTotals[i]);
        // HTML SHOWS RES FOR LAST LINE ONLY. I NEED IT TO SHOW RESULTS OF ALL LINES
   }
});

<textarea id="nums" rows="10"></textarea> 
    <div id="res"></div>
<input type="button" id="sub" value="Sum">

https://jsfiddle.net/9yc70csj/1/

Answer 1

而不是：

alert("Total for row " + (i + 1) + ": " + rowTotals[i]);

添加：

$('#res').html($('#res').html()+rowTotals[i] + "<br>");

请参阅：https://jsfiddle.net/9yc70csj/3/

Answer 2

在功能开始时，使用$('#res').html("")重置结果。

然后，要将结果添加到div，请使用以下代码：

 var div = $('<div/>');
 div.text("Total for row " + (i + 1) + ":" + rowTotals[i]);
 $('#res').append(div);

您创建一个新的div，然后将您想要的文本放入其中。然后将它追加到结果中，因此每个新div都位于#res容器的末尾。

此外，处理具有语法错误的正确空行或行是个好主意。例如，您可以：

检查行是否以数字开头（以排除空行），如此
```
if(!rows[i].match("[0-9]+")) continue;
```

使用isNaN：

检查您解析的内容确实是一个数字

val = parseFloat(rowData[j]);
if(!isNaN(val)) rowTotals[i] += val;

Answer 3

将最后一行更改为此 $('#res').html($('#res').html() + "<br>" + rowTotals[i]);

用js表示每行的总和

3 个答案: