使用jquery为table动态添加行的实现代码

这里，用的jquery来做的。关键代码如下：

代码如下:

//添加数据行；
function AddRow(){
var vTb=$("#TbData");//得到表格ID=TbData的jquery对象
//所有的数据行有一个.CaseRow的Class,得到数据行的大小
var vNum=$("#TbData tr").filter(".CaseRow").size()+1;//表格有多少个数据行
var vTr=$("#TbData #trDataRow1"); //得到表格中的第一行数据
var vTrClone=vTr.clone(true);//创建第一行的副本对象vTrClone
vTrClone[0].id="trDataRow"+vNum;//设置第一个Id为当前获取索引；防止重复添加多个ID为trDataRow1的数据行；一次添加一个；
vTrClone.appendTo(vTb);//把副本单元格对象添加到表格下方
}

该方法，主要运用了jquery的clone函数，克隆一个table的行副本。然后添加给原来的table。
删除方法关键Code：

代码如下:

使用jquery为table动态添加行的实现代码相关推荐

NPOI给word中的表格table动态添加行，并保留表格样式 , 替换文字时文字中包含＜br/＞换行
public class NPOIHelper{/// <summary>/// 输出模板docx文档/// </summary>/// <param name=&quo ...
jquery实现输入框动态增减的实例代码
2019独角兽企业重金招聘Python工程师标准>>> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transition ...
利用jquery给指定的table动态添加一行、删除一行
$("#mytable tr").find("td:nth-child(1)") 1表示获取每行的第一列 $("#mytable tr"). ...
php 动态添加表格行,jQuery给html表格动态添加行方法总结
这次给大家带来jQuery给html表格动态添加行方法总结,jQuery给html表格动态添加行的注意事项有哪些,下面就是实战案例,一起来看一下. 本文实例讲述了jQuery实现html表格动态添加新 ...
动态添加行为元素解绑事件 delegate的解绑事件 off的解绑事件
动态添加行 <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF- ...
jQuery操作Table学习总结（转）
转自:http://www.cnblogs.com/12go/archive/2011/12/01/2270756.html <style type="text/css"&g ...
ajax怎样获得表头信息,layui.table动态获取表头和列表数据示例
layui.table动态获取表头和列表数据示例 2020年07月14日 | 萬仟网IT编程 | 我要评论 ```javascript//表格layui.use('table', function() ...
汇总常用的jQuery操作Table tr td方法
2019独角兽企业重金招聘Python工程师标准>>> 1.鼠标移动行变色方法一:jQuery中的hover(fun(),fun())方法,参数一:第一个方法是添加样式功能,参数二 ...
php表格tr,jQuery+ajax实现动态添加表格tr td功能示例
本文实例讲述了jQuery+ajax实现动态添加表格tr td功能.分享给大家供大家参考,具体如下: 功能:ajax获取后台返回数据给table动态添加tr/td html部分: ajax部分: va ...
Jquery实现表格动态增加一行，删除一行(最简洁的代码实现)
最近做的项目中有一个需求就是要求在线填写表格内容时,不够的话可以动态添加一行,我这里用的jQuery来实现,下面是我项目截图展现: 当点击"添加输入框"按钮时,就会自动添加一行下 ...

使用jquery为table动态添加行的实现代码

使用jquery为table动态添加行的实现代码相关推荐

最新文章

热门文章