Javascript 选择菜单中HTML表单表中的总值

我有一个简单的HTML表单，其中一列有一个选择菜单，有两个选项：中等或高。我需要找到cell=“mediate”所在的所有行，并计算同一行中另一个单元格的总数，然后对cell=“High”所在的所有行重复此操作。下面是一个JS提琴，显示了一个完整的表格示例：

在本例中，总体中等的结果为1.6，总体高的结果为8.7（它是平均小时/周列中的值的总和）。行数不会预先固定-可能有1行或多行

以下是表单的实际html：

<div class="span8"><br>
      <table id="activities" class="table table-bordered table-striped">
        <thead>
          <tr>
            <th>Activity</th>
            <th>Risk</th>
            <th>Hours/Week</th>
            <th>Weeks/Year</th>
            <th>Average Hours/Week</th>
            <th></th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td><input name="Activity"  id="Activity" type="text" value=""/></td>
            <td><div class="controls">
              <select id="Risk">
                <option></option>
                <option>Moderate</option>
                <option>High</option>
              </select>
            </div></td>
            <td><input class="span1" id="A1" type="text" value=""/></td>
            <td><input class="span1" id="B1" type="text" value=""/></td>
            <td><input class="span1" id="C1" type="text" value=""/></td>
            <td><button class="btn">Delete Activity</button></td>
          </tr>
          <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td>Total Moderate</td>
            <td></td>
          </tr>
          <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td>Total High</td>
            <td></td>
          </tr>
        </tbody>
      </table>
    </div>

活动
风险
小时/周
周/年
每周平均小时数
中庸的
高
删除活动
完全中等
总高度

我使用jQuery的and函数迭代每一行。我再次使用

find

查找级别和值（第2列和第5列），并使用switch语句将值添加到总数中。我需要执行

value*1

将字符串转换为整数，这样它就可以相加。这里的默认行为是连接

最后两行设置表格单元格的值。如果你能给它们一个特定的ID，那就容易多了，这样你就可以做

$（“mediatetotal”）.html（）

，但因为没有给它，我使用了一些jQuery选择器来做

---

有很多方法来攻击这个，但是我强烈建议您考虑jQuery数据项。它内置了字段求和、排序、过滤等功能，比自制东西容易得多。另外，它看起来比一张光秃秃的桌子和全桌的支撑要好得多

下面是一个使用页脚回调进行求和的简单示例：

因为表中的所有数据都可以通过API完全访问，所以很容易对其进行计算。您--可以--简单地根据中高标志筛选表，并仅显示该数据，允许用户动态修改该视图

---

而且，如果您的数据非常长，它有分页和ajax加载选项来提高用户级别的速度。

您的High总计应该是8.7感谢您指出这是一个输入错误，我们已编辑以更正此错误。

var moderateTotal = 0;
var highTotal = 0;
$("#activities").find("tr").each(function() {
    var tr = $(this);
    var level = tr.find("td:nth-child(2)").html();
    var value = tr.find("td:nth-child(5)").html();

    switch(level)
    {
        case "Moderate":
            moderateTotal += value*1;
        break;
        case "High":
            highTotal += value*1;
        break;
    }
});

$("#activities tr:last td:last").prev().html("High Total: " + highTotal);
$("#activities tr:last").prev().find("td:last").prev().html("Moderate Total: " + moderateTotal);