JS 排序输出实现table行号自增前端动态生成的tr


Posted in Javascript onAugust 13, 2014

最近做一项目,需要对数据进行排序输出,要求有行号,依次递增1.2.3.4.5.......。

前端通过<c:forEach> 遍历动态输出的<tr>,代码如下:

<!-- 循环生成,列表数据 --> 
<c:forEach items="${pager.list}" var="auction"> 
<tr class="bg1"> 
<td width="10" align="center"><span class="numberClass"></span></td> 
<td width="30" align="center">${auction.dept}</td> 
<td width="40" align="center">${auction.donor}</td> 
<td width="40" align="center">¥:${auction.auctionSum}.00</td> 
<td width="40" align="center"><span onClick="displayDetails('xxxx}')" style="color:blue;cursor:pointer;">查看详细信息</span></td> 
</tr> 
</c:forEach>

行号自增js代码(需引入jquery):

$(function(){ 
function number(){ 
for(var i=0;i< $(".numberClass").length;i++){ 
$(".numberClass").get(i).innerHTML = i+1; 
} 
} 
number(); 
});
Javascript 相关文章推荐
jQuery学习笔记之DOM对象和jQuery对象
Dec 22 Javascript
JavaScript在XHTML中的用法详解
Apr 11 Javascript
获取数组中最大最小值方法js代码(自写)
Aug 12 Javascript
js或jquery实现页面打印可局部打印
Mar 27 Javascript
使用JS中的exec()方法构造正则表达式验证
Aug 01 Javascript
jQuery实现边框动态效果的实例代码
Sep 23 Javascript
JavaScript中原型链存在的问题解析
Sep 25 Javascript
jQuery EasyUI右键菜单实现关闭标签/选项卡
Oct 10 Javascript
详解jQuery中基本的动画方法
Dec 14 Javascript
js实现图片旋转 js滚动鼠标中间对图片放大缩小
Jul 05 Javascript
详解用函数式编程对JavaScript进行断舍离
Sep 18 Javascript
Vue 实现点击空白处隐藏某节点的三种方式(指令、普通、遮罩)
Oct 23 Javascript
js图片闪动特效可以控制间隔时间如几分钟闪动一下
Aug 12 #Javascript
js使用for循环查询数组中是否存在某个值
Aug 12 #Javascript
jquery库文件略庞大用纯js替换jquery的方法
Aug 12 #Javascript
用javascript读取xml文件读取节点数据
Aug 12 #Javascript
javascript获取checkbox复选框获取选中的选项
Aug 12 #Javascript
随鼠标移动的时钟非常漂亮遗憾的是只支持IE
Aug 12 #Javascript
JS、CSS以及img对DOMContentLoaded事件的影响
Aug 12 #Javascript
You might like
windows下的WAMP环境搭建图文教程(推荐)
2017/07/27 PHP
根据判断浏览器类型屏幕分辨率自动调用不同CSS的代码
2007/02/22 Javascript
javascript 用原型继承来实现对象系统
2010/03/22 Javascript
javascript如何动态加载表格与动态添加表格行
2013/11/27 Javascript
基于 Docker 开发 NodeJS 应用
2014/07/30 NodeJs
JavaScript6 let 新语法优势介绍
2016/07/15 Javascript
Three.js学习之文字形状及自定义形状
2016/08/01 Javascript
canvas滤镜效果实现代码
2017/02/06 Javascript
jQuery实现选项卡功能(两种方法)
2017/03/08 Javascript
Nodejs 复制文件/文件夹的方法
2017/08/24 NodeJs
JS温故而知新之变量提升和时间死区
2019/01/27 Javascript
JS 实现发送短信验证码的“59秒后重新发送验证短信”功能
2019/08/23 Javascript
JS数组方法join()用法实例分析
2020/01/18 Javascript
NodeJS模块Buffer原理及使用方法解析
2020/11/11 NodeJs
Vite和Vue CLI的优劣
2021/01/30 Vue.js
[56:18]DOTA2上海特级锦标赛主赛事日 - 4 败者组第四轮#2 MVP.Phx VS Fnatic第二局
2016/03/05 DOTA
Python内存管理方式和垃圾回收算法解析
2017/11/11 Python
Python编程实现的简单神经网络算法示例
2018/01/26 Python
python list元素为tuple时的排序方法
2018/04/18 Python
python实现简单登陆系统
2018/10/18 Python
python多进程使用及线程池的使用方法代码详解
2018/10/24 Python
利用python计算windows全盘文件md5值的脚本
2019/07/27 Python
装上这 14 个插件后,PyCharm 真的是无敌的存在
2021/01/11 Python
心理学专业大学生职业生涯规划范文
2014/02/19 职场文书
少先队学雷锋活动总结范文
2014/03/09 职场文书
授权委托书
2014/07/31 职场文书
我为党旗添光彩演讲稿
2014/09/10 职场文书
四风批评与自我批评范文
2014/10/14 职场文书
七一建党节慰问信
2015/02/14 职场文书
普通员工辞职信范文
2015/05/12 职场文书
超级礼物观后感
2015/06/15 职场文书
解除处分决定书
2015/06/25 职场文书
使用canvas实现雪花飘动效果的示例代码
2021/03/30 HTML / CSS
SpringBoot2 参数管理实践之入参出参与校验的方式
2021/06/16 Java/Android
利用JavaScript写一个简单计算器
2021/11/27 Javascript
Python实现双向链表
2022/05/25 Python