Question

我遇到这种情况：

...
 for (var i = 0; i < json.length; i++)
 {
  output += '<tr>';
     for ( var objects in json[i])
     {
        if (objects == 'amt_1')
       {
         output += '<td id="amt">' + json[i][objects] + '</td>';
       }
      }
  output += '</tr>';
        }
     output += '<tr">';
     var amt = 0;
     $('#amt').each(function() {
        amt += $(this).text();
     });
     output += '<td>' + amt + '</td>';
     output += '</tr>';
  $('#details').append(output);

 }

这是表格的一部分，给我这样的东西：

<td id="amt">4.58</td>
<td id="amt">55.74</td>
<td id="amt">193.5</td>
<td></td>

并且在上一个td中，我希望其余部分与id = amt的总和我似乎没有工作

任何想法？

Thnaks

Answer 1

问题是你使用的是id而不是类，id应该是唯一的，所以javascript只返回1 td。但是，多个元素可以共享同一个类。

此外，jQuery不起作用，因为尚未将元素添加到文档中。

for (var i = 0; i < json.length; i++)
{
     output += '<tr>';
     for ( var objects in json[i])
     {
         if (objects == 'amt_1')
         {
             output += '<td class="amt">' + json[i][objects] + '</td>';
         }
      }
      output += '</tr>';
}
output += '<tr">';
$('#details').append(output); //Copied here, this will add the above elements 
                              //to the document subtree, which allows jquery 
                              //to search for them
output = ""; //Reset output
var amt = 0;
$('.amt').each(function() { //Changed to class selector
    amt += parseInt($(this).text());
});
output += '<td>' + amt + '</td>';
output += '</tr>';
$('#details').append(output); //Append result

Answer 2

就像他们说你应该使用一个类而不是id

output += '<td class="amt">' + json[i][objects] + '</td>';

然后你必须在你的jQuery选择器之前将输出添加到DOM ， $（'。amt'），才能找到元素

$('#details').append(output); //<--append BEFORE you select the .amt elements var amt = 0; $('.amt').each(function() { amt += parseFloat($(this).html()); //parseFloat on the html }); output = '<tr">'; //<-- reset output here output += '<td>' + amt + '</td>'; output += '</tr>'; $('#details').append(output);

仍然最好只计算你的for循环中的金额

var total = 0;

...

if (objects == 'amt_1') { var curAmt = json[i][objects]; output += '<td class="amt">' + curAmt + '</td>'; total += parseFloat(curAmt); }

...

output += '<td>' + total + '</td>';

Answer 3

页面上不能有多个具有相同ID的元素。 $("#someId")始终会选择最多1个元素。所以，你的第一个问题是你甚至没有一个元素列表。您可以使用class来解决此问题。

解决id问题后，您遇到的麻烦就是尝试添加文本，就好像它是一个数字一样。首先，在一个循环中将文本转换为数字，然后再次遍历整个集合并尝试添加文本数字。只需在第一个循环中获得总数。您将添加数字而不是文本，并且您只需要迭代您的集合一次。

此外，您不需要迭代对象的键只获取属性。您可以直接引用该属性：json[i].amt_1

虽然我们正在使用它，但是不要构建html字符串，而是直接创建DOM元素。并利用$.each()进行循环。

var total = 0;
$.each(json, function (i, item) {
    var row  = $('<tr>').appendTo("#details");
    $("<td>").appendTo(row).addClass("amt").text(item.amt_1);
    total += item.amt_1;
});
var row = $("<tr>").appendTo("#details");
$("<td>").appendTo(row).text(total);

如何在javascript中添加多个值？

3 个答案: