Question

我想用每个表行中的输入class='dtb'，.toan，.ly计算平均值.hoa。

问题：它只是计算表的第一行，然后将结果放入下面的其他行中，而不是在每个表行中进行计算。

$(document).ready(function () {
    $('#outputtable > tbody > tr').each(function () {
        var toan = parseInt($('.toan').html());
        var ly = parseInt($('.ly').html());
        var hoa = parseInt($('.hoa').html());
        var dtb = ((toan + ly + hoa) / 3);
        $(this).find('.dtb').html(dtb.toFixed(1));
    });
});

Answer 1

您需要在行中找到每个输入类的实例

$('.toan').html()将始终返回在整个页面中找到的该类的第一个元素的值

代替使用find()

var toan = parseInt($(this).find('.toan').html());

Answer 2

您可能要从这里更改：

$('#outputtable > tbody > tr').each(function () {
  var tr = $(this);

  var toan = +tr.find('.toan').text();
  var ly = +tr.find('.ly').text();
  var hoa = +tr.find('.hoa').text();
  var dtb = (toan + ly + hoa) / 3;

  tr.find('.dtb').html(dtb.toFixed(1));
});

在 each 函数中使用$(this)（在这种情况下），它将分配给当前的tr元素。从该元素中，您找到一个具有名为toan-ly-hoa的类的元素。

要获取每个td标签中的文本，只需使用.text()方法（无需使用.html()方法）。

要将字符串转换为数字（根据您的情况），您只需使用

+$(this).find('.toan').text();

无需使用parseInt方法。可读性更好。

Answer 3

我看到了您的fiddle代码，

更改此附加表行的代码

console.log()

收件人：

 $("#outputtable").find("tbody:last").append("<tr><td>"+ stt +"</td><td class='ten'>"+_ten+"</td><td class='toan'>"+_toan+"</td><td class='ly'>"+_ly+"</td><td class='hoa'>"+_hoa+"</td><td class='dtb'>?</td></tr>");

此平均计算代码：

$("#outputtable").append("<tr><td>"+ stt +"</td><td class='ten'>"+_ten+"</td><td class='toan'>"+_toan+"</td><td class='ly'>"+_ly+"</td><td class='hoa'>"+_hoa+"</td><td class='dtb'>?</td></tr>");

收件人：

$(document).ready(function () {
    $('#outputtable > tbody > tr').each(function () {
        var toan = parseInt($(this).find('.toan').html());
        var ly = parseInt($(this).find('.ly').html());
        var hoa = parseInt($(this).find('.hoa').html());
        var dtb = ((toan + ly + hoa) / 3);
        $(this).find('.dtb').html(dtb.toFixed(1));
    });
});

计算每个tr的平均td

3 个答案: