js求表单指定一列数据相加的函数，增加一行数据，结果自动累加并展示在调用窗口

转载于 2019-07-08 22:44:52 发布 · 1.8k 阅读

文章标签：

#js 列实现自动求和 #js求表单指定一列数据相加的函数 #某列相加 #结果自动累加 #函数方法

js 专栏收录该内容

8 篇文章

订阅专栏

本文介绍了一种使用JavaScript对HTML表格中特定列进行求和的方法。通过jQuery库选择表格元素，遍历每一行并累加指定列的数值，最后更新至表格底部，实现了动态数据汇总。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title> 页面名称 </title>
</head>
<body>
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<table id="tabname">
    <tr><td>aaa</td><td>bbb</td><td>ccc</td></tr>
    <tr><td>1</td><td>45</td><td>gg</td></tr>
    <tr><td>2</td><td>55</td><td>ff</td></tr>
    <tr><td>3</td><td>43</td><td>gg</td></tr>
    <tr><td></td><td></td><td></td></tr>
</table>
 
<script type="text/javascript">
function tableAdd(tab,d) {
    var s = 0;
    var tr = $(tab).find("tr");
    for (var i = 1; i < tr.length-1; i++)
        s += parseFloat(tr.eq(i).find("td").eq(d).text()) || 0;
    tr.eq(i).find("td").eq(d).text(s);
}
$(function(){
    tableAdd("#tabname",1);//这里的1是求和的列号，你每次修改或增加一行数据之后都要再次调用下这个函数
});
</script>
</body>
</html>