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 相关文章推荐
JavaScript 学习笔记(十六) js事件
Feb 01 Javascript
jQuery源码分析-03构造jQuery对象-工具函数
Nov 14 Javascript
JS文本框默认值处理详解
Jul 10 Javascript
JavaScript框架(iframe)操作总结
Apr 16 Javascript
jquery对象和javascript对象即DOM对象相互转换
Aug 07 Javascript
再分享70+免费的jquery 图片滑块效果插件和教程
Dec 15 Javascript
JQUERY的AJAX请求缓存里的数据问题处理
Feb 23 Javascript
js遍历json对象所有key及根据动态key获取值的方法(必看)
Mar 09 Javascript
基于JavaScript实现飘落星星特效
Aug 10 Javascript
vue 2.0项目中如何引入element-ui详解
Sep 06 Javascript
Vue 中可以定义组件模版的几种方式
Aug 06 Javascript
微信小程序scroll-view实现滚动到锚点左侧导航栏点餐功能(点击种类,滚动到锚点)
Jun 11 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
php判断字符串在另一个字符串位置的方法
2014/02/27 PHP
php简单实现批量上传图片的方法
2016/05/09 PHP
PHP实现会员账号单唯一登录的方法分析
2019/03/07 PHP
php7 错误处理机制修改实例分析
2020/05/25 PHP
php对mongodb的扩展(初识如故)
2012/11/11 Javascript
jquery取消选择select下拉框示例代码
2014/02/22 Javascript
Javascript判断图片尺寸大小实例分析
2014/06/16 Javascript
node.js中的path.extname方法使用说明
2014/12/09 Javascript
jQuery中animate()方法用法实例
2014/12/24 Javascript
jquery获取文档高度和窗口高度汇总
2016/01/25 Javascript
AngularJS 中文API参考手册
2016/07/28 Javascript
JavaScript制作弹出层效果
2016/12/02 Javascript
Ajax和Comet技术总结
2017/02/19 Javascript
jQuery插件FusionCharts绘制2D双折线图效果示例【附demo源码】
2017/04/14 jQuery
vue  directive定义全局和局部指令及指令简写
2018/11/20 Javascript
可拖拽组件slider.js使用方法详解
2020/12/04 Javascript
vue 动态创建组件的两种方法
2020/12/31 Vue.js
[55:03]完美世界DOTA2联赛PWL S2 LBZS vs FTD.C 第二场 11.20
2020/11/20 DOTA
[05:06]DOTA2-DPC中国联赛 正赛 VG vs Magma选手采访
2021/03/11 DOTA
python pickle存储、读取大数据量列表、字典数据的方法
2019/07/07 Python
使用Python快乐学数学Github万星神器Manim简介
2019/08/07 Python
Python利用多线程同步锁实现多窗口订票系统(推荐)
2019/12/22 Python
使用OpenCV去除面积较小的连通域
2020/07/05 Python
预订奥兰多和佛罗里达州公园门票:FloridaTix
2018/01/03 全球购物
世界上最大的隐形眼镜商店:1-800 Contacts
2018/11/03 全球购物
Shell编程面试题
2016/05/29 面试题
美发店5.1活动方案
2014/01/24 职场文书
社团文化节策划书
2014/02/01 职场文书
个人投资计划书
2014/05/01 职场文书
三关爱志愿服务活动方案
2014/08/17 职场文书
食品委托检验协议书范本
2014/09/12 职场文书
医院财务人员岗位职责
2015/04/14 职场文书
2015年工商所工作总结
2015/05/21 职场文书
用Python远程登陆服务器的步骤
2021/04/16 Python
golang 实用库gotable的具体使用
2021/07/01 Golang
mysql序号rownum行号实现方式
2022/12/24 MySQL