- 浏览: 140334 次
- 性别:
- 来自: 未来
-
文章分类
- 全部博客 (174)
- Eclispe (3)
- javaScript (33)
- SVG学习 (22)
- Java (21)
- 网站 (12)
- learn English (1)
- 文档 (25)
- 常用网站收录 (11)
- struts (6)
- 常用API (1)
- html (2)
- jsp (2)
- spring (2)
- IDE (1)
- 数据结构 (1)
- JDBC (2)
- html + css (1)
- xml (3)
- 心声 (1)
- Axis2 (1)
- svg (4)
- webService (2)
- unix (2)
- c/c++ (3)
- html5 (1)
- Android (2)
- Jet标签 (1)
- oracle (2)
- 工具 (1)
- ideas (0)
- lean plan (1)
- java技术网站,信息收集综合及分类 (0)
最新评论
-
calosteward:
感谢博主对svg convert to PDF资源的分享。我也 ...
How to Convert a SVG File to PDF Format -
long316:
fhhhh
WinArchiver 2.7 -
long316:
ddddd
WinArchiver 2.7
<table id="idTB" border=0><!--注意id,与JS中的要相对应-->
<tr id=idTR>
<td>第一行 <input type='button'></td>
</tr>
</table>
<input type="button" onclick="addRow()" value="添加一行"><br>
<input type="button" onclick="delRow()" value="删除一行"> Row index:<input id="idIndex">(<a id="idFirst">1</a>~<a id="idLast">1</a>)
<script>
function addRow(){//添加表格的一行
oTR=idTB.insertRow(idTB.rows.length);
tmpNum=oTR.rowIndex;
oTD=oTR.insertCell(0);
oTD.innerText="第" + tmpNum+"行";//在该处添加的HTML代码会原封不动的显示在页面上
oTD.innerHTML="<input type='text' name='txt"+tmpNum+"'>";//要在该格添加的HTML代码填在这里,因为这里是text,注意不要重名了。
idLast.innerText=idTB.rows.length;
if(idTB.rows.length>0)
idFirst.innerText='1';
return true;
}
function delRow(){//删除表格的一行
sIndex=idIndex.value;
if(sIndex=='')
sIndex=idTB.rows.length-1;
else
sIndex=parseInt(sIndex)-1;
idTB.deleteRow(sIndex);
idLast.innerText=idTB.rows.length;
if(idTB.rows.length==0)
idFirst.innerText='0';
}
</script>
http://www.cnblogs.com/rhodamine/archive/2006/07/18/453430.html
http://www.cnblogs.com/jjiac/archive/2005/10/10/251640.html
http://www.blogjava.net/lpeter/archive/2007/05/28/120536.html
http://blog.csdn.net/fatowen/article/details/6257610
<tr id=idTR>
<td>第一行 <input type='button'></td>
</tr>
</table>
<input type="button" onclick="addRow()" value="添加一行"><br>
<input type="button" onclick="delRow()" value="删除一行"> Row index:<input id="idIndex">(<a id="idFirst">1</a>~<a id="idLast">1</a>)
<script>
function addRow(){//添加表格的一行
oTR=idTB.insertRow(idTB.rows.length);
tmpNum=oTR.rowIndex;
oTD=oTR.insertCell(0);
oTD.innerText="第" + tmpNum+"行";//在该处添加的HTML代码会原封不动的显示在页面上
oTD.innerHTML="<input type='text' name='txt"+tmpNum+"'>";//要在该格添加的HTML代码填在这里,因为这里是text,注意不要重名了。
idLast.innerText=idTB.rows.length;
if(idTB.rows.length>0)
idFirst.innerText='1';
return true;
}
function delRow(){//删除表格的一行
sIndex=idIndex.value;
if(sIndex=='')
sIndex=idTB.rows.length-1;
else
sIndex=parseInt(sIndex)-1;
idTB.deleteRow(sIndex);
idLast.innerText=idTB.rows.length;
if(idTB.rows.length==0)
idFirst.innerText='0';
}
</script>
http://www.cnblogs.com/rhodamine/archive/2006/07/18/453430.html
http://www.cnblogs.com/jjiac/archive/2005/10/10/251640.html
http://www.blogjava.net/lpeter/archive/2007/05/28/120536.html
http://blog.csdn.net/fatowen/article/details/6257610
- test.rar (708 Bytes)
- 下载次数: 10
- 动态添加删除行.rar (741 Bytes)
- 下载次数: 6
发表评论
-
Easy UI tree
2014-12-28 17:49 531http://www.cnblogs.com/hxling/a ... -
js 时间比较
2014-11-04 10:37 363//var yourtime=document.getElem ... -
jQuery官方推出的教学视频
2013-08-02 13:07 444http://blog.jobbole.com/37699/ -
推荐给开发者的20款响应式jQuery插件
2013-07-23 10:32 524http://www.csdn.net/article/201 ... -
如何让搜索引擎抓取AJAX内容?
2013-07-17 08:32 530http://news.cnblogs.com/n/18248 ... -
修改浏览器状态栏信息
2013-02-28 22:38 627status和defaultStatus是window对象的属 ... -
HHMMss时间校验方法
2012-09-16 14:55 1030<html> <body> < ... -
javaScript程序员参考手册--源代码
2012-08-22 23:57 588******************************* ... -
禁止鼠标右键及svg中自定义右键菜单
2012-08-20 23:20 2483svg屏蔽右键菜单 1 : if(evt.button == ... -
Web中的鼠标自动移动
2012-12-23 23:35 634写了个 00:00--24:59分的正则,不知道是不是你想要的 ... -
有鼠标位置获取元素
2012-12-23 23:36 648document.elementFromPoint(x,y) ... -
JS获取网页中HTML元素的几种方法分析
2012-08-19 17:06 991oElement = document.elementFrom ... -
(转载)js技巧 .
2012-08-19 17:02 1586http://blog.csdn.net/yinshuhai/ ... -
自动实现单击事件
2012-08-19 15:08 681<html xmlns="http://www ... -
在 IE 中调试 JavaScript
2012-04-09 23:42 903http://www.fengxiaoqiang.com/bl ... -
js调试工具
2012-04-04 22:11 533js调试工具 -
js高手的作品
2012-03-23 21:39 747<!DOCTYPE HTML> <html& ... -
easyUi tree 使用方法
2012-03-14 14:06 1634http://blog.csdn.net/l277759183 ... -
JavaScript动态添加表格行(使用模板、标记)
2012-02-05 23:35 884引用: http://www.soaspx.com/dotne ... -
select 2
2012-01-15 20:27 972http://sunxin1001.iteye.com/blo ...
相关推荐
在JavaScript编程中,动态添加表格数据行是一种常见的需求,特别是在构建交互式的Web应用程序时。这个功能允许用户在不刷新整个页面的情况下添加新的记录,提高了用户体验。在这个例子中,我们将探讨如何利用...
NULL 博文链接:https://1148130696.iteye.com/blog/1726191
在开发Web应用时,动态添加和删除表格行是常见的需求,尤其在数据管理或表单填写场景中。本文将深入探讨如何使用C#后端和JavaScript前端技术来实现这一功能,为初学者提供一个基础的实践指导。 首先,我们要了解...
JavaScript动态操作表格,添加,删除行、列及单元格! 值得下载看看!资源免费,大家分享!! 更多免费资源 http://ynsky.download.csdn.net/
总的来说,"jquery表格动态添加删除行代码"是一个结合了HTML、CSS和JavaScript(主要是jQuery)的示例,它展示了如何利用这些技术来实现动态交互的表格功能。这样的功能在许多Web应用程序中都有广泛的应用,例如在线...
本文将深入探讨如何使用JavaScript动态地增加和删除表格行。 首先,我们来了解一下HTML表格的基本结构。一个表格由`<table>`元素包含,其中包含`<tr>`(表格行)元素,每行内可以有多个`<td>`(表格数据单元格)或`...
在网页开发中,jQuery库因其简洁的语法和强大的功能,被广泛用于处理DOM操作,包括动态添加和删除表格行。本篇文章将详细讲解如何利用jQuery实现这两种操作。 首先,我们来理解HTML表格的基本结构。一个表格由`...
3. **删除行**:删除表格行通常涉及到选择要删除的行,并调用`removeChild()`方法。例如,假设我们想删除点击时的当前行,可以这样实现: ```javascript function deleteRow(event) { if (confirm('确定要删除...
在IT领域,尤其是在网页开发和用户界面设计中,动态添加删除表格是一项常用的技术。它允许用户根据需求在界面上自由地增加或减少表格行或列,提高了交互性和用户体验。本篇将深入探讨这一主题,主要关注如何实现这个...
以下是一个简单的例子,展示如何使用JavaScript添加和删除表格行: ```javascript // 获取表格元素 var table = document.getElementById('myTable'); // 添加行 function addRow() { var row = table.insertRow...
4. **数据管理**:如果表格数据存储在JavaScript数组中,那么在添加、删除或编辑行时,也应同步更新数组。这有助于保持数据的一致性,并可能用于其他操作,如排序或过滤。 5. **模板字符串**:在创建新的HTML元素时...
在JavaScript中,动态添加和删除表格是常见的网页交互功能,主要应用于数据展示、表单处理等场景。这篇博文通过一个简单的实例,展示了如何利用JavaScript实现这个功能。在讲解之前,我们先了解一下HTML表格的基本...
动态添加和删除行通常涉及向现有表格动态插入或移除这些元素。 1. **动态添加行**: - 使用jQuery,可以获取表格引用,例如`$("#myTable")`,其中`#myTable`是表格的ID。 - 创建新的`<tr>`元素,可以使用`$('<tr>...
### 动态插入、添加删除表格行的JS代码 在网页开发中,表格是一个非常重要的元素,用于展示数据。为了使网页更具交互性,我们常常需要动态地对表格进行操作,比如插入或删除行等。本文将通过一个具体的示例来讲解...
在JavaScript编程中,动态添加表格行是一项常见的任务,特别是在创建数据展示或编辑功能时。本文将深入探讨如何使用模板和标记技术来实现这一功能。首先,我们先了解一下基本概念。 **1. 模板(Template)** 模板是...
接下来是删除表格。这通常涉及到找到特定的表格元素并使用`removeChild()`方法移除它们。例如,要删除刚才创建的表格,你可以这样操作: ```javascript // 假设我们保存了表格引用 document.body.removeChild(table...