如何用jQuery计算所有行的总和？ [复制]答案

【问题标题】：How to calculate sum of all rows with jQuery? [duplicate]如何用jQuery计算所有行的总和？ [复制]
【发布时间】：2017-09-29 23:13:00
【问题描述】：

下面是我的带有Add New 按钮的表格代码。点击Add New 按钮新行将创建。在图片中你可以看到这个。用户将最后输入借方和贷方值，所有借方值应为计算和总和应该显示和相同的信用值。一世我正在使用 jQuery 创建新行：

jQuery 代码：

<script type="text/javascript">
      $("#add, .check ").click(function() {
      $('#datatable-buttons tbody>tr:last')
      .clone(true)
      .insertAfter('#datatable-buttons tbody>tr:last').find('input').each(function(){
      $(this).val('');
      });
    });
    </script>

HTML表格代码：

<table id="datatable-buttons"  class="table table-striped jambo_table bulk_action">
    <thead>
      <tr class="headings">
        <th>
          <input type="checkbox" id="check-all" class="flat">
        </th>
        <th class="column-title">Account</th>
        <th class="column-title">Debits</th>
        <th class="column-title">Credits</th>
        <th class="column-title">Description</th> 
        <th class="column-title">Name</th>                          
        <th class="column-title no-link last"><span class="nobr">Action</span>
        </th>
        <th class="bulk-actions" colspan="7">
          <a class="antoo" style="color:#fff; font-weight:500;">Bulk Actions ( <span class="action-cnt"> </span> ) <i class="fa fa-chevron-down"></i></a>
        </th>
      </tr>
    </thead>                                
    <tbody>
      <tr class="even pointer">
        <td class="a-center ">
          <input type="checkbox" class="flat" name="table_records">
        </td>                                    
        <td class=" "><select class="form-control" name="journalname">
          <option>Choose option</option>                   
          <?php
          $sql = mysqli_query($conn,'SELECT * FROM `chartofaccounts`');
          while ($row1 = mysqli_fetch_array($sql)) 
            {?>
              <option value="<?php echo $row1["name"];?>"><?php echo $row1["name"];?></option>
          <?php  }?>
        </select></td>
        <td class=""><input class="form-control" type="text" name="debit" ></td>
        <td class=" "><input class="form-control" type="text" name="credit"></td>
        <td class=" "><input class="form-control" type="text" name="descc"></td> 
        <td class=" "><input class="form-control" type="text" name="name"></td>        
        <td class=" last"><a href="#">View</a>
        </td>
      </tr>                           
    </tbody>                           
  </table>
  <button type="button" id="add">Add New</button>

下图让你一目了然：

【问题讨论】：

1.在 Google 中搜索您的标题 2. 删除问题，因为它是重复的 3. 如果不是重复的（不太可能）单击 <> 按钮并创建一个 minimal reproducible example WITHOUT PHP 并解释为什么它不是重复的
你从来没有说过问题是什么；您只提供了一个屏幕截图，但没有描述您遇到的困难。
它不重复。所有其他没有像我这样的 jquery 的例子。这是我添加add new 脚本的问题。我坚持添加值并显示总和
@Fred-ii- 我不这么认为，兄弟。如果你仔细阅读我的问题，你会知道我面临什么问题

标签： php jquery mysql html-table

【解决方案1】：

为您提供了一个如何从输入字段计算总和的简单示例。

检查下面的sn-p或jsFiddle

将数字添加到3个输入，然后点击View，它将得到3个输入值的总和。

var input = $("input"),
    button = $("td.last a")

$(button).click(function () {
    var sum = 0;
    $(input).each(function() {
        sum += Number($(this).val());
    });
   $(this).html(sum)
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>
      <input>
    </td>
    <td>
      <input>
    </td>
    <td>
      <input>
    </td>
    <td class=" last"><a href="#">View</a>
  </tr>
</table>

【讨论】：