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.uploadify 上传文件插件的使用详解 for ASP.NET
Jan 22 Javascript
Javascript string 扩展库代码
Apr 09 Javascript
基于Jquery制作的幻灯片图集效果打包下载
Feb 12 Javascript
jquery的$getjson调用并获取远程的JSON字符串问题
Dec 10 Javascript
瀑布流布局代码一例
Apr 11 Javascript
JavaScript制作简易的微信打飞机
Mar 31 Javascript
JavaScript实现基于Cookie的存储类实例
Apr 10 Javascript
JS遍历ul下的li点击弹出li的索引的实现方法
Sep 19 Javascript
yii form 表单提交之前JS在提交按钮的验证方法
Mar 15 Javascript
在Vue环境下利用worker运行interval计时器的步骤
Aug 01 Javascript
JS实现躲避粒子小游戏
Jun 18 Javascript
JS前端轻量fabric.js系列物体基类
Aug 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
MySQL修改密码方法总结
2008/03/25 PHP
PHP 万年历实现代码
2012/10/18 PHP
有关于PHP中常见数据类型的汇总分享
2014/01/06 PHP
php的ZipArchive类用法实例
2014/10/20 PHP
简单谈谈php浮点数精确运算
2016/03/10 PHP
Laravel使用Caching缓存数据减轻数据库查询压力的方法
2016/03/15 PHP
CMSPRESS 10行代码搞定 PHP无限级分类2
2018/03/30 PHP
Laravel框架实现利用中间件进行操作日志记录功能
2018/06/06 PHP
laravel Task Scheduling(任务调度)在windows下的使用详解
2019/10/22 PHP
php数组指针函数功能及用法示例
2020/02/11 PHP
ext for eclipse插件安装方法
2008/04/27 Javascript
js登录弹出层特效
2014/03/07 Javascript
javascript 操作cookies详解及实例
2017/02/22 Javascript
jQuery插件zTree实现删除树节点的方法示例
2017/03/08 Javascript
vue2.0使用v-for循环制作多级嵌套菜单栏
2018/06/25 Javascript
原生js检测页面加载完毕的实例
2018/09/11 Javascript
JavaScript学习笔记之基于定时器实现图片无缝滚动功能详解
2019/01/09 Javascript
vue 实现搜索的结果页面支持全选与取消全选功能
2019/05/10 Javascript
详解在Vue.js编写更好的v-for循环的6种技巧
2020/04/14 Javascript
python实现去除下载电影和电视剧文件名中的多余字符的方法
2014/09/23 Python
解密Python中的描述符(descriptor)
2015/06/03 Python
举例讲解Python中字典的合并值相加与异或对比
2016/06/04 Python
python监控进程脚本
2018/04/12 Python
78行Python代码实现现微信撤回消息功能
2018/07/26 Python
pyqt5 实现在别的窗口弹出进度条
2019/06/18 Python
PyCharm 创建指定版本的 Django(超详图解教程)
2019/06/18 Python
python打开windows应用程序的实例
2019/06/28 Python
楼面部长岗位职责范本
2014/02/14 职场文书
师范大学生求职信
2014/06/13 职场文书
学风建设演讲稿
2014/09/12 职场文书
法人代表证明书格式
2014/10/01 职场文书
圆明园观后感
2015/06/03 职场文书
公司人事管理制度
2015/08/05 职场文书
《青山不老》教学反思
2016/02/22 职场文书
Nest.js参数校验和自定义返回数据格式详解
2021/03/29 Javascript
MySQL中datetime时间字段的四舍五入操作
2021/10/05 MySQL