Jquery、js计算table行合计

原创 2014年08月16日 11:41:15

计算table的行合计比计算列合计容易的多,这里给出两种方法。

方法一:

核心算法:
利用jquery选择器,选中table一行记录,对选中的每一行记录对象执行each访问方法,取得每一列的值,将其相加即的行合计。
demo:
function countRowTotal1() {
	
	$('#mytable tr').each(function() {
		var rowTotal = 0;
		$(this).find('td').each(function() {
			rowTotal += parseFloat($(this).text());
		});
//	alert(rowTotal);
	//将一行的结果,写入合计列,这里直接追加到列尾
		$(this).append('<td>'+rowTotal+'</td>');
	});
}

方法二:

核心算法:
利用jquery选择器,选中table一行记录,每次取得一行记录,利用正则表达式拆分各列得到数组,这里需要注意去除元素首位空白字符,再将数组元素相加即的行合计。
demo:
//每次取一行数据,再用正则表达式拆分
function countRowTotal2() {
	
	$('#mytable tr').each(function() {
		var rowTotal = 0;
		var row2 = trim($(this).text()).split(/\n|\r\n/);//innerText: "11	12	13	14", 必须要去除首位空白符
//		alert(row2.length);				
		for (var i=0; i<row2.length; i++) {
			var temp= trim(row2[i]);
//			alert(temp);
			rowTotal += parseFloat(temp);
		}
//		alert(rowTotal);
		//将一行的结果,写入合计列,这里直接追加到列尾
		$(this).append('<td>'+rowTotal+'</td>');


	});
}	
	
function trim(str){ //删除左右两端的空格
   return str.replace(/(^\s*)|(\s*$)/g, "");
}


table:

<table id="mytable" border="1" width="37%">
	<thead></thead>
	<tr>
		<td width="63" >11</td>
		<td width="68" >12</td>
		<td width="62" >13</td>
		<td width="75" >14</td>
	</tr>
	<tr>
		<td width="63" >21</td>
		<td width="68" >22</td>
		<td width="62" >23</td>
		<td width="75" >24</td>
	</tr>
</table>

效果图:



版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

js table增加一行,显示每列总和

function changeColSpan(){   var table = document.getElementById( "table" );     /* last line not co...

Jquery、js计算table列合计

利用Jquery选择器,计算table中的某一列,某一行的合计,非常方便。xia

给一个Table添加合计行

public static void AppendSumaryRow(DataTable table){    if (table.Rows.Count > 0)    {  ...

tableGrid与datagrid 分别添加合计列

我们在开发过程中经常会用到tableGrid和datagrid用来展示数据列表,下面分别列出tableGrid与datagrid添加合计列的相关代码 1.tableGrid添加合计列 //查询...

js/Jquery table 内部控件计算和tr的生成

这种table + js的计算大家都不陌生,无论是做门户网站的、还是做业务系统的经常会遇到这些东西。关于这种统计的计算大家应该都会用前端控制吧,有点就不说了,控制的代码相对比较简单。 fun...

JQuery+js操作table

jquery.table2excel.js

[JS] JQuery table 排序

function table_Sortid(name) { var table = $("#" + name); var table_th = tabl...

js、jquery 遍历table

DOCTYPE html> html> head>     title>Demotitle>     style type="text/css"> table  ...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)