`

jquery:添加和移除table一行数据

阅读更多
function addtr() {
	var $table = $("#tab tr");
	var len = $table.length;
	$("#tab").append(
			"<tr id=" + (len + 1) + "><td align='center'>" + len
					+ "</td><td align='center'>jQuery" + len
					+ "</td><td align='center'><a href='#' onclick='deltr("
					+ (len + 1) + ")'>删除</a></td></tr>");
}

// delete method
 function deltr(index){
   // alert("tr[id='"+index+"']");
    $table=$("#tab tr");
    if(index>$table.length){
      return;
    } else{
			$("tr[id='"+index+"']").remove(); 
   		//$("tr:gt('"+index+"')").each    
     	for(var temp=index+1;temp<=$table.length;temp++){
				$("tr[id='"+temp+"']").replaceWith("<tr id="+(temp-1)+"><td align='center'>"
				+(temp-2)+"</td><td align='center'>jQuery"+(temp-2)
				+"</td><td align='center'><a href='#' onclick='deltr("
				+(temp-1)+")'>删除</a></td></tr>");
    } 
	} 
}
分享到:
评论
4 楼 zyr2206328732 2012-05-25  
zyr2206328732 写道
zyr2206328732 写道
zyr2206328732 写道
   



3 楼 zyr2206328732 2012-05-25  
zyr2206328732 写道
zyr2206328732 写道
   


2 楼 zyr2206328732 2012-05-25  
zyr2206328732 写道
   

1 楼 zyr2206328732 2012-05-25  
   

相关推荐

    jQuery实现动态更改table表格数据

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作、事件处理和Ajax交互。本教程将深入探讨如何使用jQuery实现动态更改table表格数据,让你的网页表格具有实时编辑功能,提升用户体验。 ...

    jquery table 添加、删除行、列

    例如,如果你有一个ID为`myTable`的表格,你可以这样添加一行: ```javascript var newRow = $('&lt;tr&gt;&lt;td&gt;New Data&lt;/td&gt;&lt;/tr&gt;'); $('#myTable tbody').append(newRow); ``` 这段代码创建了一个新的`&lt;tr&gt;`元素,里面...

    jQuery表格添加行数据代码.zip

    在添加行数据时,可能有一个函数,例如`addRow()`,它会在表格的最后一行下方插入新的行;编辑功能可能是通过点击行触发弹出窗口或者直接在单元格内进行修改;而删除操作则可能通过一个删除按钮,调用`removeRow()`...

    jquery实现table自动添加行和编辑

    本教程将深入探讨如何使用jQuery实现表格(table)的动态添加行和编辑功能,这对于构建数据驱动的Web应用至关重要。 首先,我们需要一个基本的HTML结构来展示表格。一个简单的表格通常包括thead部分(表头)和tbody...

    jqueryTable编辑的实现

    在本文中,我们将深入探讨如何实现`jQuery Table`编辑功能,包括鼠标点击表格单元格进行编辑,以及在失去焦点(onblur)时通过Ajax保存数据。此外,我们还将提及与实现此功能相关的`jQuery`和`Table`技术。 首先,`...

    JQuery动态添加删除table行.

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作,包括动态地添加和删除表格行。本文将深入探讨如何使用jQuery实现这一功能,以提高网页交互性。 一、HTML基础 首先,我们需要一个基本...

    jquery实现json数据填充到table表格中并且实现remove add 数据

    表格的每一行都是一个`&lt;tr&gt;`元素,每个单元格则是`&lt;td&gt;`元素。我们可以先创建一个空的表格,然后根据JSON数据动态生成行。 在JavaScript或jQuery代码中,我们可以通过`$.getJSON()`方法来获取服务器端的JSON数据。...

    jQuery 动态添加或删除表格行

    本文将深入探讨如何使用 jQuery 动态添加和删除表格行,以实现高效且用户友好的数据展示。 首先,理解 HTML 表格的基本结构至关重要。`&lt;table&gt;` 元素用于创建表格,`&lt;tr&gt;` 代表表格行,`&lt;td&gt;` 或 `&lt;th&gt;` 分别表示...

    jQuery table选中表格行变色

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作、事件处理和动画效果。本主题聚焦于“jQuery table选中表格行变色”这一功能,它在交互式网页设计中尤为常见,可以提升用户体验。下面将...

    jquery表格动态添加删除行代码.zip

    每一行可以包含多个`&lt;td&gt;`(单元格)或`&lt;th&gt;`(表头单元格)。在本例中,表格中可能还包含用于添加和删除行的按钮。 2. **jQuery选择器**:jQuery通过选择器来选取HTML元素,如`$("#id")`选择ID为特定值的元素,`$...

    jQuery Table点击选中表格行变色代码.zip

    本示例中,我们关注的是"jQuery Table点击选中表格行变色代码",这是一个用于实现用户交互功能的常见需求,即当用户点击表格的某一行时,该行会高亮显示,以突出显示用户的当前选择。 首先,我们要理解jQuery的基本...

    jQuery删除table指定行

    一个表格由`&lt;table&gt;`元素构成,包含`&lt;tr&gt;`(表格行)元素,而每一行内又包含`&lt;td&gt;`(表格数据)或`&lt;th&gt;`(表头)元素。如果我们想要删除特定行,就需要找到这个行并将其从DOM中移除。 jQuery提供了`remove()`方法,...

    jquery表格添加删除行点击按钮动态添加删除行

    本主题聚焦于如何使用jQuery实现表格中添加和删除行的功能,这在数据展示和用户交互中非常常见。通过点击按钮动态添加或删除表格行,可以提高用户的交互体验,使得数据管理更加灵活。 首先,我们需要创建一个基本的...

    jQuery表格编辑添加删除行插件.zip

    在网页开发中,表格是一种常见的数据展示方式,而jQuery作为JavaScript的一个强大库,提供了丰富的功能和便利的操作,使得表格的编辑、添加和删除行变得更加简单。本文将深入探讨“jQuery表格编辑添加删除行插件”,...

    table JS 添加行和删除行

    **添加行:** 在JavaScript中,我们可以获取到表格引用,然后创建新的`&lt;tr&gt;`元素并添加到表格中。以下是一个基本示例: ```javascript // 获取表格 var table = document.getElementById('myTable'); // 创建新行...

    jQuery Table表格排序显示代码.zip

    本资源“jQuery Table表格排序显示代码.zip”聚焦于利用jQuery实现动态表格排序的功能,这对于数据展示和用户交互至关重要。下面将详细阐述相关知识点。 1. **jQuery基础**:首先,理解jQuery的基础是至关重要的。...

    table表格固定行和列

    在网页设计中,表格(Table)是一种常见的数据展示方式,尤其在数据分析、报表展示等领域。然而,当表格数据较多时,滚动浏览可能会导致表头或列宽不易辨识,这时就需要实现“固定行和列”的功能。这个功能使得用户...

    74、jquery表格动态添加删除行代码

    在IT行业中,jQuery是一个广泛使用的JavaScript库...通过以上步骤,你可以利用jQuery实现表格的动态添加和删除行功能,为用户提供更直观和灵活的数据管理界面。这种技术在数据录入、展示和编辑等场景中具有广泛的应用。

    jquery案例,为表格动态添加行

    一个简单的表格由`&lt;table&gt;`元素开始,内部包含`&lt;tr&gt;`(表格行)元素,每一行里又包含`&lt;td&gt;`(表格数据单元格)或`&lt;th&gt;`(表头单元格)。例如: ```html &lt;table id="myTable"&gt; 数据1 数据2 &lt;/table&gt; ``` 要...

    jquery实现的可增加,删除行,可多行上下移动表格

    标题 "jquery实现的可增加,删除行,可多行上下移动表格" 描述了一种使用JavaScript库jQuery创建的交互式表格功能。这个功能允许用户在表格中动态添加、删除行,以及上下移动表格中的行,提供了更灵活的数据操作体验...

Global site tag (gtag.js) - Google Analytics