http://www.blogjava.net/absolutedo/archive/2009/03/13/259488.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<script src="jquery.js"></script>
<script>
$(function(){
$(document.body).append("" +
"<table id='tab' border='1' width='60%' align='center' style='margin-top:20px'>\
<tr>\
<td width='20%'>序号</td>\
<td>操作</td>\
</tr>\
</table>");
$("#but").click(function(){
var length=$("#tab tr").length;
$("#tab").append("<tr id=tab"+length+"><td>"+length+"</td><td><input type='button' value='删除' onclick='removeLine("+length+");'></td></tr>");
});
})
function removeLine(index){
var length=$("#tab tr").length;
$("#tab"+index).remove();
for(var i=index+1;i<=length;i++){
$("#tab"+i).replaceWith("<tr id=tab"+(i-1)+"><td>"+(i-1)+"</td><td><input type='button' value='删除' onclick='removeLine("+(i-1)+");'></td></tr>");
}
}
</script>
</head>
<body>
<!--<table id="tab" border="1" width="60%" align="center" style="margin-top:20px">
<tr>
<td width="20%">序号</td>
<td>操作</td>
</tr>
</table>-->
<div style="border:2px;border-color:#00CC00;margin-left:20%; margin-top:20px">
<input type="button" id="but" value="增加"/>
</div>
</body>
</html>
分享到：
相关推荐
标题中的“jQuery表格插件及JavaScript选择框”指的是在网页开发中使用jQuery库来增强HTML表格功能以及实现更复杂的用户交互。jQuery是一个流行的JavaScript库，它简化了DOM操作、事件处理、动画效果和Ajax交互。在...
本文将深入探讨如何使用jQuery来动态给table添加和删除行，并对代码进行改进。 首先，让我们看看如何使用jQuery添加新行到table中。这里需要理解几个关键点： 1. 选择器的使用：`$('#table1')` 选择了ID为table1的...
二、jQuery 1.7.2的增强与改进 1. `.on()` 方法的强化：在1.7.2版本中，`.on()`方法成为事件绑定的主要方式，它取代了`.bind()`, `.live()`, 和 `.delegate()`。`.on()`更强大，可以处理当前及未来元素的事件。 2....
它可以与后台数据库无缝对接，通过AJAX实现数据的动态加载。 3. 树形控件（Tree）：用于展示层级结构的数据，支持节点的展开、折叠，以及节点的操作如添加、删除和编辑。 4. 下拉树（Combotree）：结合了下拉列表...
1.9.1是jQuery的一个重要版本，它对早期版本进行了许多改进和优化，删除了一些不推荐使用的API，提升了性能，并保持了向后兼容性。特别是对于Bootstrap 3.3.7这样的依赖库，jQuery 1.9.1及以上版本是必需的，因为...
花生米AJAX-UI系列之:基于JQUERY的浮动层(右键)列表菜单0.2改进版 改版本是“使用JQUERY 自创的自定义右键菜单插件 ”的重大改进，原始版本不再使用！ 可以对表格，列表，或者单个DOM容器进行右键绑定 菜单项的文字...
jQuery EasyUI 是一个基于 jQuery 的前端框架，它简化了网页用户界面开发的复杂性，提供了大量的可重用组件，如对话框、表格、菜单、按钮等。v1.3.5 是该框架的一个稳定版本，它包含了一系列的改进和修复，以提升...
花生米AJAX-UI系列之:基于JQUERY的浮动层(右键)列表菜单0.2改进版 改版本是“使用JQUERY 自创的自定义右键菜单插件 ”的重大改进，原始版本不再使用！ 可以对表格，列表，或者单个DOM容器进行右键绑定 菜单项的...
- **Sortable**：使列表或表格的行可排序，提供动态的用户交互。 6. **主题**： jQuery UI支持主题Roller，允许开发者自定义UI的视觉样式，以匹配网站的整体设计风格。通过调整CSS，可以改变按钮、对话框、滑块等...
- **Tabs（标签页）**：用于组织多个内容区域，可动态添加、删除和切换标签页。 - **DatePicker（日期选择器）**：提供日历控件，方便选择日期。 - **Layout（布局）**：对页面进行分隔，实现可调整大小的区域。 ...
3. **动画与过渡**：通过`transition`和`animation`属性，实现了元素的平滑动态变化，为网页带来了动态交互体验。 4. **响应式设计**：媒体查询(`media queries`)允许根据设备特性调整布局，支持多设备和屏幕尺寸的...
1. **DOM操作优化**：jQuery 1.3 对DOM操作进行了大量的优化，如元素选择、添加和删除等，这使得在处理大量元素时速度显著提高，提升了整体性能。 2. **事件处理**：引入了事件委托（Event Delegation）的概念，...
《jQuery 1.7.2中文版与EasyUI：打造高效前端开发》 jQuery，作为一款广泛使用的JavaScript库，以其简洁、高效的API深受开发者喜爱。本资料主要关注jQuery 1.7.2版本，该版本发布于2012年4月20日，为当时的前端开发...
1. **表格（Grid）**：LigerUI的表格组件支持数据加载、排序、分页、过滤、编辑和删除等功能，可以处理大量数据，并提供行操作和列自定义。 2. **表单（Form）**：提供各种表单控件，如文本框、下拉框、复选框、单选...
《jQuery 1.11.0：JS控件与AJAX操作表格数据详解》 jQuery，作为一款广泛使用的JavaScript库，极大地简化了DOM操作、事件处理、动画制作以及Ajax交互等任务。在“jquery-1.11.0”这个版本中，jQuery团队继续提供了...
jQuery是一款广泛应用于前端开发的JavaScript库，它极大地简化了JavaScript操作DOM、处理事件、实现动画效果以及进行Ajax交互等任务。本离线版API文档主要针对jQuery 1.6版本，适用于1.4.4至1.6.2之间的所有小版本。...
3. 编辑功能：内置行编辑、行添加和行删除功能，支持单元格级别的编辑，方便用户对表格数据进行增删改操作。 4. 导入导出：支持数据的导入和导出，可以将表格数据保存为CSV、Excel或其他格式。 5. 国际化：支持多...
本手册将深入探讨 jQuery 的核心概念与实用技巧。 1. **jQuery 选择器** - CSS 选择器：jQuery 兼容大部分 CSS 选择器，如 `id`、`class`、`tag`，以及更复杂的选择器如 `nth-child` 和 `attribute selectors`。 ...
三、jQuery 1.11.3的改进与优化 1. **浏览器兼容性**：jQuery 1.11.x系列着重于保持对旧版浏览器的兼容，包括IE6-8，这使得那些仍需支持老浏览器的项目依然可以依赖jQuery。 2. **性能提升**：1.11.3版本对内部...