jQuery实现html table行Tr的复制、删除、计算功能
本文实例讲述了jQuery实现html table行Tr的复制、删除、计算功能。分享给大家供大家参考,具体如下:
添加行:
function addtr(){ var tr = $("#tb tr").eq(0).clone(); tr.appendTo("#tb"); //tr.insertBefore("#tb tr:last"); }
<table id="tb"> <tr> </tr> // tr 的下标从 0 开始 <tr> </tr> </table>
删除行:
index 要删除的 table 的 tr 的下标
$("#tb_id tr").eq(index).remove();
计算 table 中 tr 的 个数:
("#tb tr").length
更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery表格(table)操作技巧汇总》、《jQuery操作json数据技巧汇总》、《jQuery form操作技巧汇总》、《jQuery常用插件及用法总结》、《jQuery扩展技巧总结》及《jquery选择器用法总结》
希望本文所述对大家jQuery程序设计有所帮助。
相关推荐
-
JQuery DataTable删除行后的页面更新利用Ajax解决
使用Jquery的DataTable进行数据表处理非常方便,常遇到的一个问题就是删除一行后页面必须进行更新,需要注意的方法如下:前台页面中初始化table时注意: 复制代码 代码如下: var table = $('#sorting-advanced'); table.dataTable({ 'bServerSide': true, 'sAjaxSource': 'servlet/UserList<%=queryString%>', 'bProcessing': true, 'bStateSa
-
jquery获取table中的某行全部td的内容方法
复制代码 代码如下: <table><tr class="PurViewData" id="trid95"> <td>14</td> <td id="95"><a style="color:#0000CC" href="/PurviewManage/AddPurview?id=95">TopParty优惠</a>
-
jQuery操作表格(table)的常用方法、技巧汇总
以下列出13个jQuery操作table常用到的功能: 1.鼠标移动行变色 复制代码 代码如下: $('#table1 tr').hover(function(){ $(this).children('td').addClass('hover')}, function(){ $(this).children('td').removeClass('hover')}); 方法二: 复制代码 代码如下: $("#table1 tr:gt(0)").hover(function()
-
jQuery html表格排序插件tablesorter使用方法详解
tablesort是一款很好用的jQuery表格排序插件. 支持多种数据类型排序,会自动识别表格内容数据类型,使用也非常方便. 使用jQuery tablesort实现html表格方法: 1. 下载jQuery和tablesort脚本,并在html中引用该脚本文件: <script type="text/javascript" src="../jquery-latest.js"></script> <script type="
-
使用jquery为table动态添加行的实现代码
这里,用的jquery来做的.关键代码如下: 复制代码 代码如下: //添加數據行: function AddRow(){ var vTb=$("#TbData");//得到表格ID=TbData的jquery对象 //所有的数据行有一个.CaseRow的Class,得到数据行的大小 var vNum=$("#TbData tr").filter(".CaseRow").size()+1;//表格有多少个数据行 var vTr=$("#
-
jquery中的sortable排序之后的保存状态的解决方法
当时也就从jquery的官方网站上抄了几句搞上去,后来发现用处不大,还挺慢.汗---以至于到今天早上也没搞清楚怎么样才能把排序后的结果保存起来,正好现在公司要做一个这样的功能,就又从新学习了下.首先,在jquery的官方demo(http://jqueryui.com/demos/)上找到了相似的代码.我所要的叫就是portlets(http://jqueryui.com/demos/sortable/portlets.html)这种效果.就像igoogle首页那样的.冒似很简单,把要引用的js
-
jQuery表格插件datatables用法详解
一.Datatables简介 DataTables是一个jQuery的表格插件.这是一个高度灵活的工具,依据的基础逐步增强,这将增加先进的互动控制,支持任何HTML表格.主要特点: 自动分页处理 即时表格数据过滤 数据排序以及数据类型自动检测 自动处理列宽度 可通过CSS定制样式 支持隐藏列 易用 可扩展性和灵活性 国际化 动态创建表格 免费的 二.如何使用 在做后台的时候并没有美工和前端工程师来配合你做页面,为了显示数据并有一定的美感,我们可以使用jQuery的DataTables插件来帮助我
-
jquery遍历table的tr获取td的值实现方法
html代码: <tbody id="history_income_list"> <tr> <td align="center"><input type="text" class="input-s input-w input-hs"></td> <td align="center"><input type="text&q
-
jQuery实现鼠标跟随提示层效果代码(可显示文本,Div,Table,Html等)
本文实例讲述了jQuery实现鼠标跟随提示层效果代码.分享给大家供大家参考,具体如下: 运行效果截图如下: Web网站有不少需要用到tip提示层的地方,结合jquery的jquery.cluetip.js ,可以实现本地字符或ajax异步调用显示提示层.如以上购评分明细提示.(优势:宽度需要调用页加载时定义,高度auto , 且三角指定图标能根据显示层的大小位置来调用它的位置,达到醒目直观的效果) jquery.cluetip.css /* global */ #cluetip-close im
-
JQuery动态给table添加、删除行 改进版
复制代码 代码如下: <html> <head> <title> </title> <script src="js/jquery-1.4.2_min.js" type="text/javascript"></script> <script type="text/javascript" language="javascript"> var row
-
使用jQuery操作HTML的table表格的实例解析
最终效果图: 简单来看一下其中的主要部分: HTML: .td_back_color { background-color: red; } .td_center { text-align: center; font-weight:bold; } CSS: <table id="tbl_count"> <caption>2013春节聚会收支统计</caption> <tr> <th>姓名</th> <th>
随机推荐
- 在职程序员为啥比不过在野程序员
- VirtualBox 在Centos 7 中安装增强功能图解 (共享文件夹)
- 利用ganglia监控redis的最新解决方法
- 详解AngularJS ui-sref的简单使用
- 32位和64位皆适用的MyEclipse安装教程
- js中parseFloat(参数1,参数2)定义和用法及注意事项
- Mysql select in 按id排序实现方法
- javascript刷新父页面的各种方法汇总
- 理解Javascript的caller,callee,call,apply区别
- 基于一致性hash算法(consistent hashing)的使用详解
- jQuery学习笔记——jqGrid的使用记录(实现分页、搜索功能)
- 基于jquery的图片的切换(以数字的形式)
- jQuery实现首页顶部可伸缩广告特效代码
- JS实现的简易拖放效果示例
- 将MySQL从MyISAM转换成InnoDB错误和解决办法
- 自定义的Troop<T>泛型类( c++, java和c#)的实现代码
- java HashMap和HashTable的区别详解
- JS实现定时任务每隔N秒请求后台setInterval定时和ajax请求问题
- 简单实现Android读取网络图片到本地
- PC蓝牙通信C#代码实现