jquery - 如何通过使用 jquery 添加该表的行来获取表总数

标签 jquery html

我需要通过添加基于相同 id 的表格行来获取表格总数,但这里对于第一个表格它正确出现但对于第二个表格它添加第一个表格总数并显示总和。 如何避免将其添加到第二个表中。 我的 HTML 代码:

<table>
  <tr style="background:#2b2e76">
    <th colspan="1" style="padding: 0;">
      <p style="color:white">
        Table One

      </p>
    </th>
    <th>
      <p style="color:white" class="BundleB4936" id="B4936">Total : <span class="BundelRowTotalB4936">1400.00</span></p>
    </th>
  </tr>
  <tr>
    <td>
      <input type="text" value="200.00" name="row_total[]" id="rowtotal11_B4936" class="rowTotal">
    </td>
  </tr>
  <tr>
    <td>
      <input type="text" value="1200.00" name="row_total[]" id="rowtotal12_B4936" class=" rowTotal">
    </td>
  </tr>
</table>
<table>
  <tr style="background:#2b2e76">
    <th colspan="1" style="padding: 0;">
      <p style="color:white">
        Table Two

      </p>
    </th>
    <th>
      <p style="color:white" class="BundleB1027" id="B1027">Total : <span class="BundelRowTotalB1027">1750.00</span></p>
    </th>
  </tr>
  <tr>
    <td>
      <input type="text" value="100.00" name="row_total[]" id="rowtotal16_B1027" class="rowTotal">
    </td>
  </tr>
  <tr>
    <td>
      <input type="text" value="250.00" name="row_total[]" id="rowtotal17_B1027" class="rowTotal">
    </td>
  </tr>
</table>

我的 jquery :

 var Bsum = 0;
    var BundelID = '';
    $(".rowTotal").each(function() {
      var RowID = $(this).attr('id');
      var suffix = RowID.match(/\d+/)[0];
      BundelID = $('.BundleB' + suffix).attr('id');

      if (RowID.indexOf(BundelID) != -1) {
        var BValue = $('#' + RowID).val();
        if (!isNaN(BValue)) {
          Bsum += parseFloat(BValue);
        }
      }
      $('.BundelRowTotal' + BundelID).html(parseFloat(Bsum).toFixed(2));

    });

这是我得到的输出

enter image description here

但我希望输出应该像下面这样

enter image description here

有什么建议请! 谢谢。

最佳答案

你的 ID 解析有问题试试这个代码而不是你的

注意 -> 更改的行有注释。

已更新

 $("table").each(function() {
 var Bsum = 0;
  var BundelID = '';
$(this).find(".rowTotal").each(function() {

  var RowID = $(this).attr('id');
  //var suffix = RowID.match(/\d+/)[0];
  var suffix = RowID.split("_")[1];

  console.log(suffix)
  BundelID = $('.Bundle' + suffix).attr('id');
  console.log(BundelID);
  if (RowID.indexOf(BundelID) != -1) {
    var BValue = $('#' + RowID).val();
    if (!isNaN(BValue)) {
      Bsum += parseFloat(BValue);
    }
  }
  console.log(Bsum);
  $('.BundelRowTotal' + BundelID).html(parseFloat(Bsum).toFixed(2));

});
});

Here是一个工作副本 注意-> 我从 HTML 中删除了总和,数字由代码计算

关于jquery - 如何通过使用 jquery 添加该表的行来获取表总数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44652588/

相关文章:

jquery - 延迟然后触发一个新页面

javascript - Ext JS 布局错误

html - CSS中可以设置线性渐变的长度吗?

html - CSS中的圆心元素

javascript - 表单提交后如何停止从部分页面重定向

javascript - 如何在对话框中锁定焦点?

android - 为什么 Google Chrome 会影响我的 CSS @media-queries?

html - 选择标记中的溢出属性

javascript - 动态变量

javascript - 在 javascript 函数中调用 JQuery HTTP GET 请求