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、css、img等浏览器缓存问题的2种解决方案
Oct 23 Javascript
node.js中的buffer.Buffer.byteLength方法使用说明
Dec 10 Javascript
javascript实现图片循环渐显播放的方法
Feb 24 Javascript
JavaScript 七大技巧(二)
Dec 13 Javascript
探析浏览器执行JavaScript脚本加载与代码执行顺序
Jan 12 Javascript
详解JavaScript中数组和字符串的lastIndexOf()方法使用
Mar 13 Javascript
浅谈js的异步执行
Oct 18 Javascript
vue自定义指令实现v-tap插件
Nov 03 Javascript
js实现的在线调色板功能完整实例
Dec 21 Javascript
JS使用ActiveXObject实现用户提交表单时屏蔽敏感词功能
Jun 20 Javascript
JavaScript强制类型转换和隐式类型转换操作示例
May 01 Javascript
layui 数据表格+分页+搜索+checkbox+缓存选中项数据的方法
Sep 21 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
限制ckeditor上传图片文件大小的方法
2013/11/15 PHP
zf框架的registry(注册表)使用示例
2014/03/13 PHP
php数组中删除元素之重新索引的方法
2014/09/16 PHP
thinkphp 字母函数详解T/I/N/D/M/A/R/U
2017/04/03 PHP
PHP字符串与数组处理函数用法小结
2020/01/07 PHP
jquery教程ajax请求json数据示例
2014/01/13 Javascript
代码获取历史上的今天发生的事
2014/04/11 Javascript
javascript获取dom的下一个节点方法
2014/09/05 Javascript
简单了解Backbone.js的Model模型以及View视图的源码
2016/02/14 Javascript
JS控制伪元素的方法汇总
2016/04/06 Javascript
jQuery实现鼠标滚动图片延迟加载效果附源码下载
2016/06/28 Javascript
利用Vue.js指令实现全选功能
2016/09/08 Javascript
js仿小米手机上下滑动效果
2017/02/05 Javascript
基于JavaScript实现购物车功能
2017/02/07 Javascript
JS字符串false转boolean的方法(推荐)
2017/03/08 Javascript
深入浅析JSONAPI在PHP中的应用
2017/12/24 Javascript
nodejs取得当前执行路径的方法
2018/05/13 NodeJs
vue-router命名路由和编程式路由传参讲解
2019/01/19 Javascript
Node.js系列之安装配置与基本使用(1)
2019/08/30 Javascript
javascript的delete运算符知识点总结
2019/11/19 Javascript
JS实现移动端可折叠导航菜单(现代都市风)
2020/07/07 Javascript
跟老齐学Python之编写类之二方法
2014/10/11 Python
Python实现对象转换为xml的方法示例
2017/06/08 Python
Python中用post、get方式提交数据的方法示例
2017/09/22 Python
Python多进程并发与多线程并发编程实例总结
2018/02/08 Python
Python实用工具FuckIt.py介绍
2019/07/02 Python
Django框架创建mysql连接与使用示例
2019/07/29 Python
python禁用键鼠与提权代码实例
2019/08/16 Python
VScode连接远程服务器上的jupyter notebook的实现
2020/04/23 Python
Python Dataframe常见索引方式详解
2020/05/27 Python
如何填写个人简历自我评价
2013/12/10 职场文书
没有孩子的离婚协议书怎么写
2014/09/17 职场文书
2015初中政治教学工作总结
2015/07/21 职场文书
Opencv中cv2.floodFill算法的使用
2021/06/18 Python
JS的深浅复制详细
2021/10/16 Javascript
一文搞懂MySQL索引页结构
2022/02/28 MySQL