jquery计算表格列，求和

王家五哥

于 2021-09-22 13:18:16 发布

阅读量1.7k

点赞数 3

分类专栏： html案例 js小工具 jQuery 文章标签： jquery javascript ajax

本文链接：https://blog.csdn.net/qq_36521848/article/details/120413087

版权

html案例同时被 3 个专栏收录

44 篇文章 0 订阅

订阅专栏

js小工具

32 篇文章 0 订阅

订阅专栏

jQuery

22 篇文章 0 订阅

订阅专栏

jquery计算表格列，求和

有时候，需要统计网页上数据总数，系统没有提供该功能，需要手动计算，于是设计了这段代码

效果展示：

核心代码：

$(function() {
	var totalRow = 0;
	$('#overTimes tr').each(function() {
		$(this).find('td:eq(1)').each(function() {
			totalRow += parseFloat($(this).text());
		});
	});
	console.log('计算共有：' + totalRow + '小时');
});

代码示例：求表格第二例和

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function() {
				var totalRow = 0;
				$('#overTimes tr').each(function() {
					$(this).find('td:eq(1)').each(function() {
						totalRow += parseFloat($(this).text());
					});
				});
				console.log('计算共有：' + totalRow + '小时');
			});
		</script>
	</head>
	<body>
		<table id="overTimes" rules="all">
			<tr>
				<th>Header0</th>
				<th>Header1</th>
				<th>Header2</th>
				<th>Header3</th>
				<th>Header4</th>
			</tr>
			<tr>
				<td>1.25</td>
				<td>1.13</td>
				<td>2</td>
				<td>2.6</td>
				<td>5.3</td>
			</tr>
			<tr>
				<td>8.6</td>
				<td>1.32</td>
				<td>2.4</td>
				<td>5.2</td>
				<td>5.6</td>
			</tr>
			<tr>
				<td>6.5</td>
				<td>3</td>
				<td>9.4</td>
				<td>4.2</td>
				<td>2.3</td>
			</tr>
		</table>
	</body>
</html>

王家五哥

关注

3
点赞
踩
9

收藏

觉得还不错? 一键收藏
0
评论
jquery计算表格列，求和

jquery计算表格列，求和有时候，需要统计网页上数据总数，系统没有提供该功能，需要手动计算，于是设计了这段代码核心代码：$(function() { var totalRow = 0; $('#overTimes tr').each(function() { $(this).find('td:eq(1)').each(function() { totalRow += parseFloat($(this).text()); }); }); console.log('计算共
复制链接

扫一扫