calulate суммирование ячеек таблицы с использованием jquery

Question

Я работаю с jQuery. Я хочу вычислить суммирование ячеек таблицы, используя jQuery. Мой код здесь:

<table id="table"> 
<tr> 
    <td>Item1</td> 
    <td>Item2</td> 
    <td>Item3</td> 
    <td>Item4</td> 
    <td>Item5</td> 
    <td>Total</td> 
</tr> 

<tr> 
    <td><input type="text" value="1"/></td> 
    <td><input type="text" value="2"/></td> 
    <td><input type="text" value="3"/></td> 
    <td><input type="text" value="4"/></td> 
    <td><input type="text" value="5"/></td> 
    <td><input type="text" /></td> 

</tr> 
<tr> 
    <td><input type="text" value="1"/></td> 
    <td><input type="text" value="2"/></td> 
    <td><input type="text" value="3"/></td> 
    <td><input type="text" value="4"/></td> 
    <td><input type="text" value="5"/></td> 
    <td><input type="text" /></td> 

</tr> 

Я хочу, чтобы сумма второго и четвертого столбца и отображается в последнем столбце для каждой строки (т.е. item3+item5 и результат будет отображаться в общей колонке) , Как это сделать, используя цикл for each с использованием jQuery?

Answer 1

Попробуйте это:

$(document).ready(function(){ 
    $("#table tr").each(function(){ 
     var a = $(this).find("td:eq(2)").find("input").val(); 
     var b = $(this).find("td:eq(4)").find("input").val(); 
     var c=parseInt(a)+parseInt(b); 
     $(this).find("td:eq(5)").find("input").val(c); 
    }); 
}); 

Посмотреть демо: Fiddle

Answer 2

Вы можете использовать обработчик изменения как

//register the change handler only for 3rd and 5th input elements 
$('#table').find('td:nth-child(3) input, td:nth-child(5) input').change(function() { 
    var $inputs = $(this).closest('tr').find('input'); 
    $inputs.last().val((+$inputs.eq(2).val() || 0) + (+$inputs.eq(4).val() || 0)) 
}).filter('td:nth-child(5) input').change(); //to initialize values 

Demo: Fiddle