繁体   English   中英

一页两个html表获取特定的表格列总和

[英]One page two html table get specific tabels column sum

我在一页中有两个表。

第一个表: table id="yeni"

第二张表: table id="eski"

我编写了一个函数来汇总特定表的特定列。

列中唯一的区别是IDS。 例如:

第一行1_1、1_2、1_3

第二行2_1、2_2、2_3

 function sum(columno,table_id){

    var cost=0;
    var rowcount=5
    for (i=1 ; i<rowcount;i++){ 

             var t =document.getElementById( i + "_" + columno);

    cost=cost+t.value;
    }

return cost;

}

如何在函数中使用表格ID的参数来识别表格?

我的HTML表格:

<table id="yeni" style="border: 1px solid rgb(0, 0, 0);">
   <tr id="1">
      <td><input id="1_1" style="width: 70px; font-size: 11px;"></td>
      <td><input id="1_2" style="width: 80px; font-size: 11px;"></td>
      <td><input id="1_3" style="width: 80px; font-size: 11px;"></td>
      <td><input id="1_4" style="width: 80px; font-size: 11px;"></td>
      <td><input id="1_5" style="width: 80px; font-size: 11px;"></td>
      <td><input id="1_6" style="width: 80px; font-size: 11px;"></td>
      <td><input id="1_7" style="width: 80px; font-size: 11px;"></td>
      <td><input id="1_8" type="hidden" value="75" style="width: 80px; font-size: 11px;"></td>
      <td><button></button></td>
   </tr>
   <tr id="2">
      <td><input id="2_1" style="width: 70px; font-size: 11px;"></td>
      <td><input id="2_2" style="width: 80px; font-size: 11px;"></td>
      <td><input id="2_3" style="width: 80px; font-size: 11px;"></td>
      <td><input id="2_4" style="width: 80px; font-size: 11px;"></td>
      <td><input id="2_5" style="width: 80px; font-size: 11px;"></td>
      <td><input id="2_6" style="width: 80px; font-size: 11px;"></td>
      <td><input id="2_7" style="width: 80px; font-size: 11px;"></td>
      <td><input id="2_8" type="hidden" value="30.68" style="width: 80px; font-size: 11px;"></td>
      <td><button></button></td>
   </tr>
   <tr id="3">
      <td><input id="3_1" style="width: 70px; font-size: 11px;"></td>
      <td><input id="3_2" style="width: 80px; font-size: 11px;"></td>
      <td><input id="3_3" style="width: 80px; font-size: 11px;"></td>
      <td><input id="3_4" style="width: 80px; font-size: 11px;"></td>
      <td><input id="3_5" style="width: 80px; font-size: 11px;"></td>
      <td><input id="3_6" style="width: 80px; font-size: 11px;"></td>
      <td><input id="3_7" style="width: 80px; font-size: 11px;"></td>
      <td><input id="3_8" type="hidden" value="16.56" style="width: 80px; font-size: 11px;"></td>
      <td><button></button></td>
   </tr>
   <tr id="4">
      <td><input id="4_1" style="width: 70px; font-size: 11px;"></td>
      <td><input id="4_2" style="width: 80px; font-size: 11px;"></td>
      <td><input id="4_3" style="width: 80px; font-size: 11px;"></td>
      <td><input id="4_4" style="width: 80px; font-size: 11px;"></td>
      <td><input id="4_5" style="width: 80px; font-size: 11px;"></td>
      <td><input id="4_6" style="width: 80px; font-size: 11px;"></td>
      <td><input id="4_7" style="width: 80px; font-size: 11px;"></td>
      <td><input id="4_8" type="hidden" value="30.68" style="width: 80px; font-size: 11px;"></td>
      <td><button></button></td>
   </tr>
   <tr id="5">
      <td><input id="5_1" style="width: 70px; font-size: 11px;"></td>
      <td><input id="5_2" style="width: 80px; font-size: 11px;"></td>
      <td><input id="5_3" style="width: 80px; font-size: 11px;"></td>
      <td><input id="5_4" style="width: 80px; font-size: 11px;"></td>
      <td><input id="5_5" style="width: 80px; font-size: 11px;"></td>
      <td><input id="5_6" style="width: 80px; font-size: 11px;"></td>
      <td><input id="5_7" style="width: 80px; font-size: 11px;"></td>
      <td><input id="5_8" type="hidden" style="width: 80px; font-size: 11px;"></td>
      <td><button></button></td>
   </tr>
</table>

对于两个表的单元格ID的规则类似于第一行1_1,1_2,1_3对于第二行2_1,2_2,2_3,依此类推

这是一个问题,任何元素的id属性对于整个网页都必须是唯一的。 仅仅因为您的表具有不同的id值,并不意味着它有助于区分单元格行。

您需要在每个表格单元格前加上表格id值(例如<td><input id="eski_4_4" style="width: 80px; font-size: 11px;"></td> ),或查找表格单元格不同(例如,使用JavaScript是它们是表的子级的事实)。

这可能对您有帮助

sum(columno,table_id){

var cost=0;
var rowcount=5
for (i=1 ; i<rowcount;i++){ 
       var t = $(table_id).find("#" + i + "_" + columno);
       cost=cost+t.value;
}

退货成本; }

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM