Question

我一直在尝试编写一段代码来总结JQuery中表格的值数周，而我却没有修复它。
我的目标是获得它而不必修改表的源代码（即向tds添加类或ID）以及获得紧凑的东西。这是我用JQuery编写的第一个东西，所以我猜它只是一个基本问题...
我找到了一个函数来获得一个运行良好的列的总和：

$(document).ready(function(){
    $("table").on('input', '.txtCal', function () {
           var calculated_total_sum = 0;

           $("table").each(function () {
               var get_textbox_value = $(this).val();
               if ($.isNumeric(get_textbox_value)) {
                  calculated_total_sum += parseFloat(get_textbox_value);
                  }                  
                });
                  $("#total_sum_value").html(calculated_total_sum);
           });

此代码仅适用于包含一列的表。我修改它以使其适用于具有多个列的表，而无需使用以下命令将类添加到表的源代码：nth-child（）选择器：

$("table").on('input', function(){
var calculated_total_sum= 0;
        $("td:nth-child(2) input").each(function(){
            var get_textbox_value = $(this).val();
            if($.isNumeric(get_textbox_value)){
            calculated_total_sum += parseFloat(get_textbox_value);
            }
    });
   $("tr:last td:nth-child(2) ").html(calculated_total_sum);
   }); 
 });

这段代码运行良好，但在我的情况下有一个大问题：表格非常大并且实现此代码意味着必须为每列重复它，所以至少50次...我猜有找到更好的解决方案。

我尝试了两种不同的方式，但没有一种方法可以使用：

1）创建一个变量，它获取所选td的索引并尝试将其插入函数中：

$("td").on('input', function(){
var col = $(this).parent().children().index($(this));
var index= col+1;       
 var calculated_total_sum= 0;
        $("td:nth-child(index) input").each(function(){
            var get_textbox_value = $(this).val();
            if($.isNumeric(get_textbox_value)){
            calculated_total_sum += parseFloat(get_textbox_value);
            }
    });
   $("tr:last td:nth-child(index) ").html( calculated_total_sum);
    });

2）将变量直接放在第一个函数中：

$("td").on('input', function(){
        var calculated_total_sum= 0;
        $("td:nth-child($(this).parent().children().index($(this))) input").each(function(){
            var get_textbox_value = $(this).val();
            if($.isNumeric(get_textbox_value)){
            calculated_total_sum += parseFloat(get_textbox_value);
            }
    });
   $("tr:last td:nth-child($(this).parent().children().index($(this))) input") ").html( calculated_total_sum);
   });

两者都没有奏效，而且我非常想法...我是一名编码的新手，所以我想我不会看到阻碍功能发挥作用的细节。我认为这是一个选择器问题，我在很多教程中搜索了一个答案，但我只能找到对这类案例没有涉及的简单例子的解释。如果有人帮助我，我会很高兴的！

知道了！我在上周的另一个问题的答案中找到了一个函数（参见最初的here），这个函数非常好用。我只需要根据我的情况调整它并更改事件以使其动态工作，结果是：

    $("input").blur(function() {
    $('table thead th').each(function(i)
    {
        calculateColumn(i);
    });
});

function calculateColumn(index)
{
    var total = 0;
    $('table tr').each(function()
    {
        var value = parseInt($('input', this).eq(index).val());
        if ($.isNumeric(value))
        {
            total += value;
        }
    });

    $('table tfoot td').eq(index).text(total);
}

如何在不向表添加类的情况下使用jquery总结表的值？

0 个答案: