2015-07-03 2 views
0

я тогда следующей таблице:HTML-таблица - перебирать строку и суммировать полей

<table style="width:100%" id="testTable"> 
    <tr> 
     <th>length per</th> 
     <th>width per</th> 
     <th>length</th> 
     <th>width</th> 
     <th>total</th> 
    </tr> 
    <tr align='right'> 
     <td> 
      <input type="text" name="length-per-input"> 
     </td> 
     <td> 
      <input type="text" name="width-per-input"> 
     </td> 
     <td> 
      <input type="text" name="length-total-input"> 
     </td> 
     <td> 
      <input type="text" name="width-total-input"> 
     </td> 
     <td> 
      <input type="text" name="total-output" disabled="disabled"> 
     </td> 
    </tr> 
    <tr align='right'> 
     <td> 
      <input type="text" name="length-per-input"> 
     </td> 
     <td> 
      <input type="text" name="width-per-input"> 
     </td> 
     <td> 
      <input type="text" name="length-total-input"> 
     </td> 
     <td> 
      <input type="text" name="width-total-input"> 
     </td> 
     <td> 
      <input type="text" name="total-output" disabled="disabled"> 
     </td> 
    </tr> 
</table> 

<input type=button value='+' onclick="addRow()" /> 
<input type=button value='Calculate' onclick="Calculate()" /> 

У меня также есть JavaScript, который добавляет значение и помещает его в общей сложности:

<script> 
    function Calculate() { 
     var lengthPerInput = $("input[name='length-per-input']").val(); 
     var widthPerInput = $("input[name='width-per-input']").val(); 
     var lengthTotal = $("input[name='length-total-input']").val(); 
     var widthTotal = $("input[name='width-total-input']").val(); 
     var total = (lengthTotal/lengthPerInput) + (widthTotal/widthPerInput); 
     $("input[name='total-output']").val(total); 
    } 
</script> 

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

$('#testTable tr').each(function(){ 
    console.log(this); 
    $(this).find('length-per-input').each(function(){ 
     console.log(this); 
    }) 
}) 

Но используя строку (доступ через «это») Я не знаю, как получить правильные клетки, получить их значение, а затем выполнить Пересчитать на эта строка для всего.

Любые советы по этому поводу? Спасибо!

ответ

1
function Calculate(tr_row) { 
     var lengthPerInput = tr_row.find("input[name='length-per-input']").val(); 
     var widthPerInput = tr_row.find("input[name='width-per-input']").val(); 
     var lengthTotal = tr_row.find("input[name='length-total-input']").val(); 
     var widthTotal = tr_row.find("input[name='width-total-input']").val(); 
     var total = (lengthTotal/lengthPerInput) + (widthTotal/widthPerInput); 
     tr_row.find("input[name='total-output']").val(total); 
    } 

Для каждой строки вы вызываете функцию для Сумм значения от Для функции вы передаете строку, то он может собирать значения на этой строке

$('#testTable tr').each(function(){ 
    Calculate($(this)) 
}) 
+0

здесь является рабочим jsfiddle http://jsfiddle.net/L662eq91/ – Su4p

+0

отлично работает, спасибо, ценят быстрые и блестящие ответы! – Gary

0

Вы можете использовать each() функцию перебирать table и используйте функцию find(), чтобы найти cell значений.

function Calculate() { 
    $('#testTable tr').each(function() { 
    var lengthPerInput = $(this).find("input[name='length-per-input']").val(); 
    var widthPerInput = $(this).find("input[name='width-per-input']").val(); 
    var lengthTotal = $(this).find("input[name='length-total-input']").val(); 
    var widthTotal = $(this).find("input[name='width-total-input']").val(); 
    var total = (lengthTotal/lengthPerInput) + (widthTotal/widthPerInput); 
    $(this).find("input[name='total-output']").val(total); 
    }); 
} 

Working Plunker

How to get a table cell value using jQuery?

Смежные вопросы