Question

我正在尝试创建使用表作为查找表。通常情况下，我会做这个服务器端，但在这种情况下，我只有一个html表，表将由客户端输入。

基本上，当填写表格时，他们会给我两个值，列在A和A列中。 B.然后表单需要使用C列中的相应值进行计算。列A重复多次，而不是多次输入，使用rowspan属性，这似乎真的很复杂，但它会是改变很大的事情（这可能是可能的，但我宁愿避免）。

简化版：

<table>
  <thead>
    <tr><th>Column A</th><th>Column B</th><th>Column C</th></tr>
  </thead>
  <tbody>
    <tr>
      <td rowspan="3">val1</td>
      <td>1</td>
      <td>2</td>
    </tr>
    <tr>
      <td>2</td>
      <td>2</td>
    </tr>
    <tr>
      <td>2</td>
      <td>3</td>     
    </tr>
    <tr>
      <td rowspan="2">val2</td>
      <td>4</td>
      <td>5</td>
    </tr>
    <tr>
      <td>10</td>
      <td>15</td>
    </tr>
  </tbody>
</table>

所以，如果他们输入： val1和1 - ＆gt; 2 val2和4 - ＆gt;五 val2和10 - ＆gt; 15

我的一个想法是首先将表解析为嵌套数组，然后使用它。它似乎有效，但我希望得到其他人对处理此问题的最佳方法的意见。如果我可以根据DOM查询/过滤它似乎会使用更少的内存，但是rowspan属性似乎也会使这些解决方案变得难看。

编辑：更正tr标签上的第二个rowspan属性而不是td标签编辑：尝试通过示例部分说明您可能会查找任何行

Answer 1

我认为最好的方法（除了使用表单数据服务器端之外）将使用jQuery在提交之前直接使用表单数据，而不是使用HTML结果。

但是如果你无法控制它，那么这将把每个“val＃”rowspan的“C”列值的第一行带入一个由每个“val＃”字符串键入的对象，在那里你可以使用它（通过一个例如for循环）。您应该在表标记中添加“id”属性（例如：id =“myTable”），因为这将优化jQuery选择器。

$(window).ready(function() { var vals = {}, $table = $('#myTable'); $table.find('td[rowspan]').each(function(i,e) { $(e).siblings().each(function(j,s) { var html = e.innerHTML, key = (html.match(/^[a-z0-9]+$/)) ? html : i.toString(); vals[key] = parseInt($(s).html(), 10); }); }); for(var val in vals) { if(!vals[val]) continue; vals[val] = vals[val] + 20; alert(vals[val]); // alerts 22, then 25 } });

jQuery：查找表值

1 个答案: