jquery总表格输入在多个表

我有一个PHP页面，填充MySQL的HTML表格。它输出两个带有ID headTable和'visits'的独立表格。我正在尝试总结“访问”表中的值并将总和输出到相应的“headTable”。还有一个复选框填充输入字段，并且在检查所有复选框时我也无法获得正确的总和。如果我手动键入值，总和是正确的。提前致谢。 Here is an Example on Fiddle jquery总表格输入在多个表

<table id="headTable"> 
    <tr> 
     <th>First Table</th> 
     <th><span id="appliedTotal"></span></th> 
    </tr> 
</table> 

<table id="visits"> 
    <tr> 
     <td>Jane</td> 
     <td>18.45</td> 
     <td><input type="checkbox"></td> 
     <td><input class="amount" type="text" size="20" value=""></td> 
    </tr> 
    <tr> 
     <td>Peter</td> 
     <td>100</td> 
     <td><input type="checkbox"></td> 
     <td><input class="amount" type="text" size="20" value=""></td> 
    </tr> 
</table> 

<table id="headTable"> 
    <tr> 
     <th>Second Table</th> 
     <th><span id="appliedTotal"></span></th> 
    </tr> 
</table> 

<table id="visits"> 
    <tr> 
     <td>Ronald</td> 
     <td>100</td> 
     <td><input type="checkbox"></td> 
     <td><input class="amount" type="text" size="20" value=""></td> 
    </tr> 
    <tr> 
     <td>John</td> 
     <td>100</td> 
     <td><input type="checkbox"></td> 
     <td><input class="amount" type="text" size="20" value=""></td> 
    </tr> 
</table>

和我的Jquery

<script> 

$(document).ready(function(){ 
    $(function() { 

     $('table input[type="checkbox"]').change(function() { 
      var input = $(this).closest('td').next('td').find('input'); 

      if ($(this).is(':checked')) { 
       var amount = $(this).closest('td').prev('td').text(); 
       var sum = 0; 

       $.each($('table#visits'), function() { 
        $('.amount').each(function() { 
         sum += Number($(this).val()); 
         $('#appliedTotal').html('$'+sum.toFixed(2)); 
        }); 
       }); 

       input.val(amount); 

      } else { 
       input.val('0.00'); 
       var sum = 0; 

       $('.amount').each(function() { 
        sum += Number($(this).val()); 
        $('#appliedTotal').html('$'+sum.toFixed(2)); 
       }); 

      } 
     }); 
    }); 

    $.each($('table#visits'), function() { 
     $(".amount").keyup(function() { 
      var sum = 0; 

      $('.amount').each(function() { 
       sum += Number($(this).val()); 
       $('#appliedTotal').html(sum); 
      }); 
     }); 
    }); 

}); 
</script>

这就是我一直在寻找这样做。

JSFiddle Example

来源

2011-11-12 Nick

问题是？ – shomeax

您还没有提出具体问题。但是如果你需要在jquery中总结一些输入，那么是什么阻止你将所有的输入提供给一个普通的类并且通过类来抓取它们呢？ – GordonM

我的问题是我想通过表格求和得到的值并输出到相应的'headTable'中。这段代码将两个表中的所有值相加，它甚至不是正确的总和。我在这里画一个空白... – Nick

是关于如何从美元使数字？我宁愿相反，但对你的情况下添加子（1）将其传递给数（）

和总和=前.VAL（）“$” +总结之前分配给appliedTotal当然

来源

2011-11-12 16:32:23 shomeax

不。我试图从每个单独的表格中总结出id为'visits'的值，并将总和输出到id为'headTable'的相应表格中。 – Nick

您不能在一个页面上拥有两个表格或任何其他具有相同'id'的标签。

来源

2011-11-12 17:07:18 shomeax

你有什么建议可以做到这一点？ – Nick

而不是按类别选择表格。或者将它们全部放入单独的div中，并将该概念用作选择器。 – shomeax

jquery总表格输入在多个表

回答

相关问题