实现添加一行并且第一列由A0开始autoincrement，代码如下（在文件的同一个文件夹下添加一个jquery.js文件）：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>autoincrement</title>

<script src='jquery.js'></script>

<script>

$(function(){

	$('#btnok').on('click',function(){

		//get the last tr

		var addObj = $('<tr>' + $('table tr:last').html() + '</tr>');

		//get class="add" last value

		var valObj = $('input.add').last().val(),prefix = valObj.substr(0,1), lotId = prefix + (parseInt(valObj.substr(1))+1);

		console.log(addObj);

		addObj.find('input.add').val(lotId);

		$('#tta').append(addObj);

	});

});

</script>

</head>

<body>

<input id="btnok" type='button' value="click">

<table border='1' width="400" id="tta">

<tr width="200">

<td>1</td>

<td>2</td>

<td>3</td>

<td>4</td>

<td>5</td>

</tr>

<tr width="200">

<td><input type="text" name="add[]" class="add" value="A0"></td>

<td><input type="text"></td>

<td><input type="text"></td>

<td><input type="text"></td>

<td><input type="text"></td>

</tr>

</table>

</body>

</html>

jquery中table里面的tr里的input添加一行，并且第一列autoincrement的更多相关文章

  1. 纪录一个table元素里面的tr th td

    <table border="1"> <tr> <th>name</th> <th>sex</th> < ...

  2. jquery获取table,遍历输出tr中各个td的内容（转载）

    首先,依赖jquery.. 1 $('#btntb').click(function(){ 2 $('#tab tr').each(function(i){ // 遍历 tr 3 $(this).ch ...

  3. JQuery中Table标签页和无缝滚动

    HTML代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...

  4. jQuery操作Table tr td常用的方法

    虽然现在DIV+CSS进行页的布局大行其道,但是很多地方使用table还是有很多优势,用table展示数据是比较方便的,下面汇总了jQuery操作Table tr td常用的方法,熟记这些操作技巧,下 ...

  5. 汇总常用的jQuery操作Table tr td方法

    虽然现在DIV+CSS进行页的布局大行其道,但是很多地方使用table还是有很多优势,用table展示数据是比较方便的,下面汇总了jQuery操作Table tr td常用的方法,熟记这些操作技巧,下 ...

  6. jQuery操作table tr td

    1.鼠标移动行变色 $("#tab tr").hover(function(){ $(this).children("td").addClass("h ...

  7. jQuery操作Table学习总结[转]

    <style type="text/css">       .hover       {                  }    </style>< ...

  8. es6 Object.assign ECMAScript 6 笔记（六） ECMAScript 6 笔记（一） react入门——慕课网笔记 jquery中动态新增的元素节点无法触发事件解决办法 响应式图像 弹窗细节 微信浏览器——返回操作 Float 的那些事 Flex布局 HTML5 data-* 自定义属性 参数传递的四种形式

    es6 Object.assign   目录 一.基本用法 二.用途 1. 为对象添加属性 2. 为对象添加方法 3. 克隆对象 4. 合并多个对象 5. 为属性指定默认值 三.浏览器支持 ES6 O ...

  9. Jquery操作Table

    Jquery 操作 Html Table 是很方便的,这里对表格的基本操作进行一下简单的总结. 首先建立一个通用的表格css 和一个 表格Table: table { border-collapse: ...

随机推荐

  1. x2engine

    x2engine 各版本下载 https://bitnami.com/stack/x2crm/installer https://bitnami.com/redirect/to/36211/bitna ...

  2. [每日一题] 11gOCP 1z0-052 :2013-09-27 bitmap index.................................................C37

    转载请注明出处:http://blog.csdn.net/guoyjoe/article/details/12106027 正确答案C 这道题目是需要我们掌握位图索引知识点. 一.首先我们来看位图索引 ...

  3. Adroid APPIUM实例步骤

      1.下载eclipse 2.安装java 配置环境变量 3.eclipse 安装adt android development tools 4.android sdk manager 安装tool ...

  4. [Qt] fontawesome图标

    fontawesome图标 fontawesome是一个图标的集合,里面有好多的图标,使用起来也还是非常方便的. 图标信息可以到官网去查:http://fontawesome.io/cheatshee ...

  5. mysql语句添加索引

    1.PRIMARY  KEY(主键索引)        mysql>ALTER  TABLE  `table_name`  ADD  PRIMARY  KEY (  `column`  ) 2. ...

  6. html--鼠标控制DIV移动

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  7. ipython with ubuntu

    在Linux环境下,其实IDE环境配置比较容易配.所以建议用linux做开发. 首选启动终端:Ctrl+Alt+T sudo apt-get update sudo apt-get install p ...

  8. javascript实现的有缩略图功能的幻灯片切换效果

    不久前写了一个简单的图片效果,没想到那么快就要用到项目中,所以功能方面要丰富一下: 主要改进: 1# 用圆点代替之前简单的页数显示,并且点击圆点可以显示对应图片: 2# 点击圆点,显示对应图片的缩略图 ...

  9. [转]Spring Boot——2分钟构建spring web mvc REST风格HelloWorld

    Spring Boot——2分钟构建spring web mvc REST风格HelloWorld http://projects.spring.io/spring-boot/ http://spri ...

  10. （二）CodeMirror - 配置项

    theme: string theme:'monokai' 引入对应的css, <link rel="stylesheet" href="../theme/mono ...