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 相关文章推荐
页面回到顶部的三种实现(锚标记,js)
Oct 01 Javascript
一个级联菜单代码学习及removeClass与addClass的应用
Jan 24 Javascript
JS 实现点击a标签的时候让其背景更换
Oct 15 Javascript
js用闭包遍历树状数组的方法
Mar 19 Javascript
Node.js中的process.nextTick使用实例
Jun 25 Javascript
实例讲解使用原生JavaScript处理AJAX请求的方法
May 10 Javascript
JavaScript字符串对象(string)基本用法示例
Jan 18 Javascript
jQuery使用unlock.js插件实现滑动解锁
Apr 04 jQuery
JS字符串按逗号和回车分隔的方法
Apr 25 Javascript
AngularJs 常用的过滤器
May 15 Javascript
JS失效 提示HTML1114: (UNICODE 字节顺序标记)的代码页 utf-8 覆盖(META 标记)的冲突的代码页 utf-8
Jun 23 Javascript
node.js通过axios实现网络请求的方法
Mar 05 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
磨咖啡豆的密诀
2021/03/03 冲泡冲煮
php快速查找数据库中恶意代码的方法
2015/04/01 PHP
php获取系统变量方法小结
2015/05/29 PHP
利用ASP发送和接收XML数据的处理方法与代码
2007/11/13 Javascript
JQuery each打印JS对象的方法
2013/11/13 Javascript
jQuery如何将选中的对象转化为原始的DOM对象
2014/06/09 Javascript
QQ空间顶部折页撕开效果示例代码
2014/06/15 Javascript
理解javascript中的回调函数(callback)
2014/09/02 Javascript
jquery 操作css样式、位置、尺寸方法汇总
2014/11/28 Javascript
JavaScript实现获得所有兄弟节点的方法
2015/07/23 Javascript
js倒计时简单实现代码
2016/08/11 Javascript
详解Vue用axios发送post请求自动set cookie
2017/05/10 Javascript
Angular.js实现动态加载组件详解
2017/05/28 Javascript
微信小程序开发之IOS和Android兼容的问题
2017/09/26 Javascript
jQuery实现页码跳转式动态数据分页
2017/12/31 jQuery
用Golang运行JavaScript的实现示例
2019/11/25 Javascript
详解ES6 CLASS在微信小程序中的应用实例
2020/04/24 Javascript
[47:03]完美世界DOTA2联赛PWL S3 access vs LBZS 第一场 12.20
2020/12/23 DOTA
Python配置文件解析模块ConfigParser使用实例
2015/04/13 Python
Python基础语法(Python基础知识点)
2016/02/28 Python
利用Python爬取可用的代理IP
2016/08/18 Python
python 抓包保存为pcap文件并解析的实例
2019/07/23 Python
Python JSON常用编解码方法代码实例
2020/09/05 Python
全球异乡人的跨境社交电商平台:Kouhigh口嗨网
2020/07/24 全球购物
巴西网上药店:Drogaria Araujo
2021/01/06 全球购物
数学专业毕业生自荐信
2013/11/10 职场文书
企业办公室岗位职责
2014/03/12 职场文书
企业承诺书怎么写
2014/05/24 职场文书
敲诈同学钱财检讨书范文
2014/11/18 职场文书
大明湖导游词
2015/02/03 职场文书
军训新闻稿范文
2015/07/17 职场文书
医护人员继续教育学习心得体会
2016/01/19 职场文书
升职感谢领导的话语及升职感谢信
2019/06/24 职场文书
提取视频中的音频 Python只需要三行代码!
2021/05/10 Python
为什么你写的height:100%不起作用
2021/05/10 HTML / CSS
python中__slots__节约内存的具体做法
2021/07/04 Python