<table id="table1" name="table1">
<tr>
<td><input type="text" name="weProvide" id="weProvide1" size="10"/></td>
<td><input type="text" name="weProvide" id="weProvide2" size="10"/></td>
<td><input type="text" name="weProvide" id="weProvide3" size="10"/></td>
<td><input type="text" name="weProvide" id="weProvide4" size="10"/></td>
<td></td>
</tr>
<tr>
<td><input type="text" name="weProvide" id="weProvide5" size="10"/></td>
<td><input type="text" name="weProvide" id="weProvide6" size="10"/></td>
<td><input type="text" name="weProvide" id="weProvide7" size="10"/></td>
<td><input type="text" name="weProvide" id="weProvide8" size="10"/></td>
<td></td>
</tr>
<tr>
<td><input type="text" name="weProvide" id="weProvide9" size="10"/></td>
<td><input type="text" name="weProvide" id="weProvide10" size="10"/></td>
<td><input type="text" name="weProvide" id="weProvide11" size="10"/></td>
<td><input type="text" name="weProvide" id="weProvide12" size="10"/></td>
<td><div class="red_color" onclick="insertRow1()">增加行</div></td>
</tr>
</table>
<script type="text/javascript">
function insertRow1() {
var tablelength = document.getElementById("table1");
if(tablelength.rows.length>5) {
alert("不能在增加了!");
return false;
}
newline = document.all.table1.insertRow();
var newcell1 =(newline.insertCell().innerHTML='<input type="text" name="weProvide" size="10"/>');
var newcell2 =(newline.insertCell().innerHTML='<input type="text" name="weProvide" size="10"/>');
var newcell3 =(newline.insertCell().innerHTML='<input type="text" name="weProvide" size="10"/>');
var newcell4 =(newline.insertCell().innerHTML='<input type="text" name="weProvide" size="10"/>');
var newcell5 =(newline.insertCell().innerHTML='<div class="red_color" onclick="del1()">删除行</div>');
}
function del1() {
document.all.table1.deleteRow(window.event.srcElement.parentElement.parentElement.rowIndex);
}
</script>
分享到:
相关推荐
在ASP.NET中,动态删除表格记录的数据显示是一个常见的需求,特别是在构建数据驱动的Web应用程序时。这个过程涉及到前端用户界面的交互以及后端数据库的管理。以下是对这一知识点的详细阐述: 1. **HTML和ASP.NET...
首先,动态删除表格行和列是Web应用中增强用户体验的重要特性。在HTML中,表格由`<table>`元素定义,行由`<tr>`元素表示,列则由`<td>`元素定义。为了实现动态删除,我们需要借助JavaScript,通过事件监听(如点击...
超简易动态删除表格js版
动态删除表格行 删除表格行则包括以下步骤: 1. **选择要删除的行**:用户可能通过点击行或者其他交互方式触发删除操作,我们需要找到对应的行元素。例如,如果行有一个删除按钮,可以通过事件委托来捕获点击并...
在网页开发中,jQuery库因其简洁的语法和强大的功能,被广泛用于处理DOM操作,包括动态添加和删除表格行。本篇文章将详细讲解如何利用jQuery实现这两种操作。 首先,我们来理解HTML表格的基本结构。一个表格由`...
jquery动态创建表格中的行、删除指定行
### 四、动态删除表格元素 #### 4.1 删除行 可以使用`removeChild`方法删除指定行。示例代码如下: ```javascript var rowToDelete = document.getElementById('rowId'); table.removeChild(rowToDelete); ``` ##...
html动态删除添加表格
在JavaScript中,动态添加和删除表格是常见的网页交互功能,主要应用于数据展示、表单处理等场景。这篇博文通过一个简单的实例,展示了如何利用JavaScript实现这个功能。在讲解之前,我们先了解一下HTML表格的基本...
在JavaScript编程中,动态添加和删除表格行是一个常见的需求,特别是在网页交互和数据展示中。这篇博客"JavaScript动态添加删除表格行"可能详细讲解了如何使用JavaScript实现这一功能。通过给定的标签"源码"和"工具...
动态添加表格和删除表格.html
在开发Web应用时,动态添加和删除表格行是常见的需求,尤其在数据管理或表单填写场景中。本文将深入探讨如何使用C#后端和JavaScript前端技术来实现这一功能,为初学者提供一个基础的实践指导。 首先,我们要了解...
在JavaScript中,添加和删除表格是常见的操作,特别是在动态网页设计和前端开发中。这篇文章将深入探讨如何使用JavaScript实现这个功能,并提供一个简单的源码示例。首先,我们需要理解HTML表格的基本结构,然后利用...
在IT领域,尤其是在网页开发和用户界面设计中,动态添加删除表格是一项常用的技术。它允许用户根据需求在界面上自由地增加或减少表格行或列,提高了交互性和用户体验。本篇将深入探讨这一主题,主要关注如何实现这个...
动态添加js,动态添加表格和删除表格,批量添加记录,批量添加
在网页开发中,动态创建和删除表格是一种常见的需求,特别是在数据展示和用户交互场景下。jQuery库因其简洁的API和强大的DOM操作能力,被广泛用于此类任务。本篇将深入探讨如何使用jQuery来动态实现表格的创建和删除...
本实例将深入探讨如何利用jQuery实现动态增加和删除表格行的功能,这对于创建数据表或者交互式表单来说非常实用。 首先,我们需要一个基本的HTML结构来展示表格。表格通常由`<table>`元素定义,每一行由`<tr>`元素...
* 在删除表格的行时,表格的行数会马上变化,因此需要注意循环删除的顺序 * 使用 `deleteRow()` 和 `deleteCell()` 方法时,需要传入正确的参数 index 动态设置单元格和行的属性 * 使用 `setAttribute()` 方法:...
在JavaScript(JS)中,创建一个可编辑的表格并实现动态添加和删除行的功能是一项常见的需求,尤其是在构建数据管理界面时。以下将详细介绍如何利用原生JavaScript实现这一功能。 首先,我们需要在HTML中创建一个...