摘录自:http://www.cnblogs.com/picaso/archive/2012/10/08/2715564.html

很多时候遇到需要对表格动态操作,而且一般都会有表格的序号,但是有时候我们对表格的序号直接输出是比较麻烦的,所以尝试一下使用jquery动态输出吧~~

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://common.cnblogs.com/script/jquery.js"
type="text/javascript"></script>
<title>jQuery</title>
</head>
<body>
<table width=500 border=2>
<tr><td width=250>序号</td><td width=250>项目</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
</table>
</body>
</html>

原始效果:

JS代码如下:

$(function(){
//$('table tr:not(:first)').remove();
var len = $('table tr').length;
for(var i = 1;i<len;i++){
$('table tr:eq('+i+') td:first').text(i);
} });

end----------------------------------------------------------------------------------------------

jQuery——动态给表格添加序号的更多相关文章

  1. jQuery动态对表格Table进行添加或删除行以及修改列值操作

    jQuery,不仅可以以少量的代码做很多操作,而且兼容性好(各种浏览器,各种版本). 下面用jQuery动态对表格Table进行添加或删除行以及修改列值操作 1.jQuery代码 <script ...

  2. 在<s:iterator>标签里给动态表格添加序号

    在<s:iterator>标签里给动态表格添加序号,需要用到<s:iterator>标签里的Status属性里的count eg:<s:iterator value=&q ...

  3. 第84天:jQuery动态创建表格

    jQuery动态创建表格 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  4. 使用jQuery动态克隆表格,并且添加至div中(使用前需要引入jQuery)

    <!DOCTYPE html> <html> <head> <title></title> <meta charset="u ...

  5. jquery动态创建表格

    1.代码实例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  6. JQUERY动态绘制表格,实现动态添加一行,删除一行

    HTML部分 <table style="width: 100%;" id="TABYESTERDAY11"></table> < ...

  7. JQuery动态操作表格

    新人,小白一枚,刚刚参加工作,所以会在这里记录一些遇到的问题. 最近要做的东西,是对一个表格动态的添加行,删除行,并且对表格中内容进行非空验证. <!DOCTYPE html> <h ...

  8. element表格添加序号

    表格代码:黄色部分为序号列关键代码上图: <el-table :data="tableData" border height="480" style=&q ...

  9. jquery动态合并表格行

    利用<td rowspan = "num"/>;原理来实现,其中num为要合并的行数. <!DOCTYPE html> <html> <h ...

随机推荐

  1. Android动画(一)-视图动画与帧动画

    项目中好久没用过动画了,所以关于动画的知识都忘光了.知识总是不用则忘.正好最近的版本要添加比较炫酷的动画效果,所以也借着这个机会,写博客来整理和总结关于动画的一些知识.也方便自己今后的查阅. Andr ...

  2. 企业网盘: Owncloud 搭建

    说明:搭建很简单,就是一个lamp环境,但是最新的owncloud 9.x版本对php的版本需求不能低于5.4, 所以需要下载yum源来进行安装. 搭建过程 1)配置yum源 rpm -Uvh htt ...

  3. 测试BUG记录模板(供参考)

    文档说明如下: Bug严重程度: A-崩溃的:由于程序所引起的死机.非法退出.死循环:数据库发生死锁:因错误操作导致的程序中断:主要功能错误:造成数据破坏丢失或数据异常:数据库连接错误:数据通讯错误. ...

  4. OpenCascade Ruled Surface

    OpenCascade Ruled Surface eryar@163.com Abstract. A ruled surface is formed by moving a line connect ...

  5. 关于ORM的浴室思考

    这是一个由EF群引发的随笔 平时在一个EF群摸鱼,日常问题可以归纳为以下几种: 这条sql用linq怎么写? EF可以调用我写的存储过程么? EF好慢啊一些复杂查询写起来好麻烦-- 为什么会有这些问题 ...

  6. 在ASP.NET Core 2.0中使用CookieAuthentication

    在ASP.NET Core中关于Security有两个容易混淆的概念一个是Authentication(认证),一个是Authorization(授权).而前者是确定用户是谁的过程,后者是围绕着他们允 ...

  7. 从Unity中的Attribute到AOP(六)

    本文将重点对Unity剩下常用的Attribute进行讲解,其他不常用的Attribute各位可以自行去官方文档查阅. 首先是UnityEngine命名空间下的. ColorUsage,这个主要作用于 ...

  8. webpack自定义打包命令

    更快捷的执行打包任务 1.执行类似于node_modules/.bin/webpack这样的命令其实是比较烦人且容易出错的,不过值得庆幸的是npm可以引导任务执行, 对其进行配置后可以使用简单的npm ...

  9. IdentityServer Topics(1)- 启动说明

    启动 IdentityServer的启动是中间件和服务的组合来实现的. 所有配置都在你的启动类(Startup.cs)中完成. 配置服务 通过以下方式调用将IdentityServer服务添加到DI系 ...

  10. Centos7安装ES 和 Docker搭建ES

    本文版权归博客园和作者吴双本人共同所有 转载和爬虫请注明原文地址 www.cnblogs.com/tdws 一.linux centos7.x安装ES 1.下载java sudo yum instal ...