JSP页面表格foreach取值问题

最近写了一个jsp页面，页面内table表格数据内容是foreach获取的 ，点击添加就会加入一行，然后计算某一列的合计值。对此简单记录一下个人的解决方法

如图在添加一条数据后文件的文字长度 总字数都会根据添加文稿而改变 ，计算总文字长度 和总字数 就要获取文字长度 与总字数每一列的值 然后相加，一开始我面对的问题是 把文字长度的 td与总字数的td用 id 命名 然后获取id的值相加。。

这样导致的结果是 我每次新增一条数据  每次拿到的id值都是同一个 所以我改变了之前的想法  既然拿td没有作用 我就想到了 拿每一行的tr,td的id值保持不变  只用每一行tr的行值来区分。下面看代码

 

<table class='table table-bordered table-striped' style='margin-bottom:0;'id="storyboardtable">
    <thead>
    <tr>
        <th>序号</th>
        <th >类别</th>
        <th>标题</th>
        <th>状态/内容</th>
        <th>文字长度</th>
        <th>总字数</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
 <c:forEach items="${}" var="detail">
        <tr data-index="${}" data-article-id='<c:if test="${detail.article != null}">${detail.article.id}</c:if>'>
            <td>${detail.orderValue + 1}</td>
            <td>
                <c:choose>
                    <c:when test="${detail.article != null}">文稿</c:when>
                    <c:otherwise>导语</c:otherwise>
                </c:choose>
            </td>
            <td>
            </td>
            <td>
                <c:choose>
                    <c:when test="${detail.article != null}">
                        <c:choose>
                            <c:when test="${detail.article.task != null}">${detail.article.task.name }</c:when>
                            <c:otherwise>已完成</c:otherwise>
                        </c:choose>
                    </c:when>
                </c:choose>
            </td>
            <td class="articlelength">${detail.articleLength}</td>
            <td hidden class="hcontext">${detail.article.content}"</td>
            <td  class="scontext"></td>
            <td>
            </td>
        </tr>
    </c:forEach>
    </tbody>
</table>

这是table表格 然后 看一下我写的处理方法：

function checkContentLengthSum() {
    var $trs= $("#storyboardtable tbody tr:visible");
    var sums = 0;
    var timesums = 0;
    for (var i = 0;i<$trs.length;i++) {
        var timesum =$($trs[i]).closest("tr").find(".articlelength").text();
        var sum =$($trs[i]).closest("tr").find(".hcontext").text();
       
    }
}

这是我根据tr的行值来进行获取每一列的值,根据tr的长度 可以动态的获取表格内的数据，无论新增还是删除数据  都会根据表格tr的长度获取。第一次发这种文章，，，写的不好  主要是为了记录一下自己的代码。