Jquery 如何将文本框的值按行和列分别相加并显示它们？

我要做的就是分别计算每行和每列的rowtotal columntotal和grandtotal

   <table class="table-bordered table-striped" id="example">
          @*Displays my project list headers from the database*@  

          <thead>
                <tr>
                    <th>
                        Name
                    </th>
                    <th>
                        Employee Id
                    </th>
                    <th>Cost Center</th>
                    @foreach (var item in Model.Projects)
                    {
                        <th>@Html.DisplayFor(p => item.ProjectName, new {@class = "projects" })</th>
                    }
                </tr>
                <tr>
                    <th></th>
                    <th></th>
                    <th></th>
                    @foreach (var item in Model.Projects)
                    {
                        <th>@Html.DisplayFor(p => item.Code.CodeName, new { Style = "width:5em;" })</th>
                    }
                </tr>
                <tr>
                    <th></th>
                    <th></th>
                    <th></th>
                    @foreach (var item in Model.Projects)
                    {
                        <th>@Html.DisplayFor(p => item.NetworkId)</th>
                    }
                    <th>Total</th>
                </tr>
            </thead>
     @*Displays my employee list from the database*@
            <tbody>
                @for (int i = 0; i < Model.ForecastInfoList.Count(); i++)
                {

                    <tr>
                        <td>@Html.DisplayFor(Emp1 => Model.ForecastInfoList[i].EmpName)</td>
                        <td>
                            @Html.HiddenFor(x => Model.ForecastInfoList[i].EmpId)
                            @Html.DisplayFor(Emp1 => Model.ForecastInfoList[i].EmpSapId)
                        </td>
                        <td>@Html.DisplayFor(Emp1 => Model.ForecastInfoList[i].CostCenter)</td>
                        @for (int j = 0; j < Model.ForecastInfoList[i].ProjectHours.Count(); j++)
                        {
                            <td>
                                @Html.HiddenFor(x => Model.ForecastInfoList[i].ProjectHours[j].EmpId)
                                @Html.HiddenFor(x => Model.ForecastInfoList[i].ProjectHours[j].ProjectMasterId)
                                @Html.HiddenFor(x => Model.ForecastInfoList[i].ProjectHours[j].Month)
                                @Html.TextBoxFor(x => Model.ForecastInfoList[i].ProjectHours[j].Hours, new { @class = "Hours", Style = "text-align:left; width:5em;" })  @*displays my textboxes*@
                            </td>
                        }
                        <td>
                            <span class="total_emp_value">
                                @Html.DisplayFor(x => Model.ForecastInfoList[i].EmpTotal)  @*displays my vertical total column*@
                            </span>
                        </td>

                    </tr>
                }
            </tbody>

            <tfoot>
                <tr>
                    <th></th>
                    <th></th>
                    <th>
                        Total
                    </th>
                    @for (int i = 0; i < Model.ForecastInfoList[0].ProjectHours.Count(); i++)
                    {
                        <td>
                            <span class="total_proj_value">
                                @Html.DisplayFor(x => Model.ForecastInfoList[i].ProjTotal) @*displays my horizontal total column*@
                            </span>
                        </td>
                    }
                    <td>
                        <span class="grandtotal">
                            @Html.DisplayFor(m => Model.ForecastInfoList[0].GrandTotal)
                        </span>
                    </td>
                </tr>
            </tfoot>
        </table>
    </div>
    <br />
    <div class="button">
        <p><input type="submit" class="btn-sm btn-warning" value="Save" name="Save" /> </p>
    </div>
</div>

@*显示数据库中的“我的项目列表”标题*@
名称
员工Id
成本中心
@foreach（Model.Projects中的var项）
{
@DisplayFor（p=>item.ProjectName，新的{@class=“projects”}）
}
@foreach（Model.Projects中的var项）
{
@DisplayFor（p=>item.Code.CodeName，新的{Style=“width:5em；”}）
}
@foreach（Model.Projects中的var项）
{
@DisplayFor（p=>item.NetworkId）
}
全部的
@*显示数据库中的我的员工列表*@
@for（int i=0；iModel.forecastingfolist[i].EmpName）
@Html.HiddenFor（x=>Model.forecastingfolist[i].EmpId）
@DisplayFor（Emp1=>Model.forecastingfolist[i].EmpSapId）
@DisplayFor（Emp1=>Model.forecastingfolist[i].CostCenter）
@对于（int j=0；jModel.forecastingfolist[i].ProjectHours[j].EmpId）
@Html.HiddenFor（x=>Model.forecastingfolist[i].ProjectHours[j].ProjectMasterId）
@Html.HiddenFor（x=>Model.forecastingfolist[i].ProjectHours[j].Month）
@Html.TextBoxFor（x=>Model.forecastingfolist[i].ProjectHours[j].Hours，new{@class=“Hours”，Style=“text align:left；width:5em；”}）显示我的文本框*@
}
@Html.DisplayFor（x=>Model.forecastingfolist[i].EmpTotal）@*显示我的垂直总计列*@
}
全部的
@对于（int i=0；iModel.forecastingfolist[i].ProjTotal）@*显示我的水平总计列*@
}
@Html.DisplayFor（m=>Model.forecastingfolist[0].GrandTotal）

使用的脚本

   <script>
    $(document).on("input", ".Hours", function () {

        total = 0;
       if ($(this).val() != "") {
           total += parseInt($(this).val());

           $(this).parent().parent().find(".total_emp_value").val($(this).val());
        }
        $(".total_emp_value").html(total);
    });</script>

$（文档）.on（“输入”和“.Hours”，函数（）{
总数=0；
if（$（this.val（）！=“”）{
total+=parseInt（$（this.val（））；
$（this.parent（）.parent（）.find（“.total_emp_value”）.val（$（this.val（））；
}
$（“.total_emp_value”）.html（总计）；
});

我想在总计列中显示单个列和单个行的总和，即该行中的所有文本框以及该列中的所有文本框应显示行和列的总和；但当我将脚本设置为.total_emp_值时，只有我最近更改的文本框才会显示在total_emp_值中

---

我想单独做这件事，但由于我是jquery新手，所以我无法做到这一点

您可以尝试创建一个包含大量行/列的循环。像这样的

  <script type="text/javascript">
    $(document).ready(function() {
      $("#value11").val(Number($("#textboxrow1col1").val()) + Number($("#textboxrow1col2").val()));
    });
  </script>

$（文档）.ready（函数（）{
$（“#value11”）.val（Number（$（“#textboxrow1col1”）.val（））+Number（$（#textboxrow1col2”）.val（））；
});

#值11、#textboxrow1col1、#textboxrow1col2-应该是动态的（您可以通过razor视图创建）

以下是解决此问题的方法，但不是完整的解决方案：

@{
列表数据=新列表（）{“一”、“二”、“三”}；//您的模型数据
int i=0；
int j=0；
}
@foreach（数据中的var项）
{
i++；
//for（）在对象的计数具有最后一个索引（例如i=3）时在循环内中断（使用break；）
@TextBox（“name”，new{id=“txtboxRow”+i+“col”+j}）
}

我无法明确定义#textboxrow1col1。。。像这样，因为我的行和列都是从模型中的列表生成的，所以我不知道如何标识每个行和列separately@shreyasvispute请找到下面的答案。这是在剃刀视野中完成的。你可以试着把你的模型和模拟。希望这会有帮助。根据答案，我需要更改我的jquery吗？上面的代码是生成带有序列号的文本框id。在此之后，您必须使用JQuery计算rowtotal和columntotal。我使用与您相同的逻辑创建了单独的id，但现在如何将单个行和列的总和绑定到我的total_emp_hrs column我对您的要求不感兴趣。总数

@{
List<string> data = new List<string>() { "one", "two", "three" }; // Your Model data
    int i = 0;
    int j = 0;
}

<div>
    <table>
        @foreach (var item in data)
        {
            i++;
            //for () inside loop to break when the count of your object has the last index e.g. i =3 (use break;)
            <tr>
                <td>@Html.TextBox("name","", new { id = "txtboxRow" + i + "col" + j })</td>
            </tr>
        }
    </table>
</div>