Question

每当用户对任何表格单元格进行更改时，我希望能够动态更新“新建”列下的总值。

DOM：

<div id='lc_adjustments'>
  <table id='adjustments' cellspacing='0' width='550px' class='lc_nf' border='0'
  cellpadding='0'>
    <tbody>
      <tr>
        <td>
          <table cellspacing='0' width='100%' class='lcb' border='0' cellpadding='0'>
            <tr>
              <td>
                <table cellspacing='1' width='100%' class='ibody' border='0' cellpadding='0'>
                  <colgroup>
                    <col width='250px'></col>
                    <col width='150px'></col>
                    <col width='150px'></col>
                  </colgroup>
                  <tr class='header'>
                    <td>Item Name</td>
                    <td>Current Value</td>
                    <td>New Value</td>
                  </tr>
                  <tr onmouseover='high(this);' class='even' onmouseout='low(this);'>
                    <td class='cl'>Item number 1</td>
                    <td class='cl'>89.50</td>
                    <td class='cl'>
                      <input class='clsMandatoryReal' onchange='getTotal();' id='totalable'
                      value='89.50' size='25' type='text'>
                    </td>
                  </tr>
                  <tr onmouseover='high(this);' class='odd' onmouseout='low(this);'>
                    <td class='cl'>Item number 2</td>
                    <td class='cl'>69.70</td>
                    <td class='cl'>
                      <input class='clsMandatoryReal' onchange='getTotal();' id='totalable'
                      value='69.70' size='25' type='text'>
                    </td>
                  </tr>
                  <tr onmouseover='high(this);' style='font-weight: bold;' onmouseout='low(this);'
                  class='even'>
                    <td class='cl'>TOTAL STOCK MASS</td>
                    <td class='cl'>?</td>
                    <td class='cl'>?</td>
                  </tr>
                </table>
              </td>
            </tr>
          </table>
        </td>
      </tr>
    </tbody>
  </table>

我试图在jquery中这样做，但我的功能似乎不起作用：

function getTotal() {

  var total = 0.0;

  //iterate over each of the cells
  $('table.ibody tbody tr').
  children('td.cl').
  children('input#totalable:not(:last)').each(function () {

    total += $(this).text();
  });

  $('table.ibody tbody tr').
  children('td.cl').
  children('input#totalable:last)').value = total;

  alert(total);

}

我对jquery或javascript中的解决方案持开放态度。 html部分由Struts生成，这意味着在大多数情况下我对html class / id属性的处理能力不高。

Answer 1

这是一个jQuery替代方案：

var total = 0;

//Iterate all td's in second column
$('#adjustments>tbody>tr>td:nth-child(2)').each( function(){
   total += parseFloat($(this).text()) || 0;       
});

alert(total)

Answer 2

这最终对我有用：

function getTotal（）{

         var total = 0.0;

         $('table.ibody tbody tr').
         children('td.cl').
         children('input#totalable').each(function(){ 
             total += parseFloat(this.value);
         });

         $('table.ibody tbody tr').
         children('td.cl').
         children('div#totalable').html(total);

         alert(total);

}

我需要在表中找到列的总值，不包括最后一行

2 个答案: