ASP .NET table 带有文本框的行和列的总和

Question

我有一个 ASP .NET webforms 应用程序，员工可以在其中填写时间表。我有一个 table，其中有 ASP:TextBox 供用户输入，我想做的是计算他们在当前行和当前列中的总小时数。

我看过之前的这个例子：SUM Total for Column 我非常接近。我运行以下 javascript 在任何文本框的每个 keyup:

var totalsByRow = [0, 0, 0, 0, 0];
var totalsByCol = [0, 0, 0, 0, 0];
$(document).ready(function () {
    $('.sum').keyup(function (e) {
        var $dataRows = $("#sum_table tr:not('.totalColumn, .titlerow')");

        $dataRows.each(function (i) {
            $(this).find('td:not(.totalRow)').each(function (j) {
                totalsByCol[j] += parseFloat($(this).val());
                totalsByRow[i] += parseFloat($(this).val());
            });
        });

        for (var i = 0; i < totalsByCol.length - 1; i++) {
            totalsByCol[totalsByCol.length - 1] += totalsByCol[i];
        }

        $("#sum_table td.totalCol").each(function (i) {
            $(this).html("total:" + totalsByCol[i]);
        });

        $("#sum_table td.totalRow").each(function (i) {
            $(this).html("total:" + totalsByRow[i]);
        });
    });
});

问题很简单：$(this).html() 没有得到文本框的值。我也根据其他帖子尝试了 $(this).val() 和 $(this).value 但没有成功。那么如何获取调用此keyup函数的文本框的值呢？

编辑：

我使用的 HTMl 代码只是我设置的一个简单测试 table。在此进一步说明：

<script src="TotalForm.js"></script>
<table id="sum_table" border="1">
  <tr class="titlerow">
    <td>Apple</td>
    <td>Orange</td>
    <td>Watermelon</td>
    <td>Strawberry</td>
    <td>Total By Row</td>
  </tr>
  <tr>
    <td class="rowAA">
      <asp:TextBox runat="server" ID="TextBox1" CssClass="sum"></asp:TextBox>
    </td>
    <td class="rowAA">
      <asp:TextBox runat="server" ID="TextBox2" CssClass="sum"></asp:TextBox>
    </td>
    <td class="rowBB">
      <asp:TextBox runat="server" ID="TextBox3" CssClass="sum"></asp:TextBox>
    </td>
    <td class="rowBB">
      <asp:TextBox runat="server" ID="TextBox4" CssClass="sum"></asp:TextBox>
    </td>
    <td class="totalRow"></td>
  </tr>
  <tr>
    <td class="rowAA">
      <asp:TextBox runat="server" ID="TextBox5" CssClass="sum"></asp:TextBox>
    </td>
    <td class="rowAA">
      <asp:TextBox runat="server" ID="TextBox6" CssClass="sum"></asp:TextBox>
    </td>
    <td class="rowBB">
      <asp:TextBox runat="server" ID="TextBox7" CssClass="sum"></asp:TextBox>
    </td>
    <td class="rowBB">
      <asp:TextBox runat="server" ID="TextBox8" CssClass="sum"></asp:TextBox>
    </td>
    <td class="totalRow"></td>
  </tr>
  <tr>
    <td class="rowAA">
      <asp:TextBox runat="server" ID="TextBox9" CssClass="sum"></asp:TextBox>
    </td>
    <td class="rowAA">
      <asp:TextBox runat="server" ID="TextBox10" CssClass="sum"></asp:TextBox>
    </td>
    <td class="rowBB">
      <asp:TextBox runat="server" ID="TextBox11" CssClass="sum"></asp:TextBox>
    </td>
    <td class="rowBB">
      <asp:TextBox runat="server" ID="TextBox12" CssClass="sum"></asp:TextBox>
    </td>
    <td class="totalRow"></td>
  </tr>
  <tr class="totalColumn">
    <td class="totalCol">Total:</td>
    <td class="totalCol">Total:</td>
    <td class="totalCol">Total:</td>
    <td class="totalCol">Total:</td>
    <td class="totalCol">Total:</td>
  </tr>
</table>

Answer 1

编辑这部分代码

 $dataRows.each(function (i) {
            $(this).find('td:not(.totalRow)').each(function (j) {
                totalsByCol[j] += parseFloat($(this).val());
                totalsByRow[i] += parseFloat($(this).val());
   });
});

来自

 $dataRows.each(function (i) {
                $(this).find('td:not(.totalRow)').each(function (j) {
                    totalsByCol[j] += parseFloat($(this).find(".sum").val());
                    totalsByRow[i] += parseFloat($(this).find(".sum").val());
       });
    });

.fin("sum") 找到输入文本控件。

ASP .NET table 带有文本框的行和列的总和

ASP .NET table sum of rows and columns with textbox

javascript

c#

asp.net

jquery

webforms