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 相关文章推荐
仅IE6/7/8中innerHTML返回值忽略英文空格的问题
Apr 07 Javascript
JS实现点击下载的小例子
Jul 10 Javascript
28个常用JavaScript方法集锦
Jan 14 Javascript
jQuery自定义添加&quot;$&quot;与解决&quot;$&quot;冲突的方法
Jan 19 Javascript
JavaScript算法教程之sku(库存量单位)详解
Jun 29 Javascript
详解vue-router和vue-cli以及组件之间的传值
Jul 04 Javascript
纯js实现画一棵树的示例
Sep 05 Javascript
vue 组件高级用法实例详解
Apr 11 Javascript
vue+springboot实现项目的CORS跨域请求
Sep 05 Javascript
JQuery判断radio单选框是否选中并获取值的方法
Jan 17 jQuery
微信小程序左滑删除实现代码实例
Sep 16 Javascript
深入webpack打包原理及loader和plugin的实现
May 06 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
Yii2框架BootStrap样式的深入理解
2016/11/07 PHP
关于laravel 日志写入失败问题汇总
2019/10/17 PHP
求解开jscript.encode代码的asp函数
2007/02/28 Javascript
JavaScript版DateAdd和DateDiff函数代码
2012/03/01 Javascript
使用js实现一个可编辑的select下拉列表
2014/02/20 Javascript
jQuery常用操作方法及常用函数总结
2014/06/19 Javascript
简介JavaScript中toUpperCase()方法的使用
2015/06/06 Javascript
jQuery 1.9.1源码分析系列(十)事件系统之主动触发事件和模拟冒泡处理
2015/11/24 Javascript
jQuery+ajax读取并解析XML文件的方法
2016/09/09 Javascript
Bootstrap免费字体和图标网站(值得收藏)
2017/03/16 Javascript
js实现多张图片延迟加载效果
2017/07/17 Javascript
JavaScript代码模拟鼠标自动点击事件示例
2020/08/07 Javascript
[03:36]2014DOTA2 TI小组赛综述 八强诞生进军钥匙球馆
2014/07/15 DOTA
python实现复制整个目录的方法
2015/05/12 Python
Python彩色化Linux的命令行终端界面的代码实例分享
2016/07/02 Python
用Python实现数据的透视表的方法
2018/11/16 Python
对python同一个文件夹里面不同.py文件的交叉引用方法详解
2018/12/15 Python
使用python-opencv读取视频,计算视频总帧数及FPS的实现
2019/12/10 Python
django中的数据库迁移的实现
2020/03/16 Python
Python内置异常类型全面汇总
2020/05/28 Python
Django-silk性能测试工具安装及使用解析
2020/11/28 Python
2021年值得向Python开发者推荐的VS Code扩展插件
2021/01/25 Python
Python解析m3u8拼接下载mp4视频文件的示例代码
2021/03/03 Python
检测用户浏览器是否支持CSS3的方法
2009/08/29 HTML / CSS
常用的HTML5列表标签
2017/06/20 HTML / CSS
Puccini乌克兰:购买行李箱、女士手袋网上商店
2020/08/06 全球购物
在什么时候需要使用"常引用"
2015/12/31 面试题
秋季婚礼证婚词
2014/01/11 职场文书
迟到检讨书800字
2014/01/13 职场文书
判缓刑人员个人思想汇报
2014/10/10 职场文书
2014年个人工作总结模板
2014/12/15 职场文书
Django分页器的用法你都了解吗
2021/05/26 Python
自动在Windows中运行Python脚本并定时触发功能实现
2021/09/04 Python
分析SQL窗口函数之取值窗口函数
2022/04/21 Oracle
CSS的calc函数用法小结
2022/06/25 HTML / CSS
Docker安装MySql8并远程访问的实现
2022/07/07 Servers