1

我有一个 HTML 表格，它允许用户直接或从选择菜单输入一些值。

<form action="" method="">
<table id="scores" width="358" border="1">
<tr>
<th colspan="5">Activities</th>
</tr>
<tr class="header">
<td width="104">Activity</td>
<td width="163">Rating</td>
<td width="69">Hours Per Week</td>
<td width="163">Weeks Per Year</td>
<td width="163">Average Hours Per Week</td>
</tr>
<tr>
<td class="title"><input type="text" value=""/></td>
<td><select name="rating">
<option value=""></option>
  <option value="High">High</option>
  <option value="Moderate">Moderate</option>
</select></td>
<td class="title"><input type="text" value=""/></td>
<td class="title"><input type="text" value=""/></td>
<td>&nbsp;</td>
</tr>
<tr>
<td class="title"><input type="text" value=""/></td>
<td><select name="rating">
<option value=""></option>
  <option value="High">High</option>
  <option value="Moderate">Moderate</option>
</select></td>
<td class="title"><input type="text" value=""/></td>
<td class="title"><input type="text" value=""/></td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td class="title">Total High</td>
<td class="title" id="totalHigh"></td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td class="title">Total Moderate</td>
<td class="title" id="totalModerate"></td>
</tr>
<tr>
<td colspan="5"><button class="copy"  value="Set Value">Submit</button></td>
</tr>
</table>

我需要执行如下几个计算：

  1. 对于每一行，我需要计算“每周平均小时数”，即（每周小时数 * 每年周数）/52

  2. 对于每一行，用户可以为评级选择“高”或“中等”。然后，我需要计算 Rating = "High" 的所有行和 Rating = "Moderate" 的所有行的 "Average Hours Per Week" 总数。

我今天大部分时间都在拔出我最后剩下的头发，试图使用我是新手的 jQuery 来做一些事情。我在以下位置设置了一个 jsfiddle：

http://jsfiddle.net/tZPDr/

它有一个简化版本的表格。非常感谢有关如何在用户键入时动态执行这两个计算的任何帮助。

非常感谢，史蒂夫

4

2 回答 2

0

如果您想作为用户类型执行此操作，则需要绑定到keypressor keydown。

例子：

$('td.hours input').on('keypress', function() {
   //get  the values and calculate
});

然后选择您的字段并执行计算。你可以得到这样的值

例子：

var hrs = $('td.hours input').val();
于 2012-04-29T23:25:59.883 回答
0

做了一些调整，看看这个小提琴。休息一下，你应该能够弄清楚。:)

于 2012-04-29T23:18:35.430 回答