`
vista_move
  • 浏览: 30000 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js中给tabel动态添加行

阅读更多
页面:
<table id="exhibitsTr" border="0" cellspacing="0" cellpadding="0" class="edit-table">
             	 				<tr>
					                <td align="center" width='30%'>展品名称</td>
					                <td align="center" width='30%'>图片</td>
					                <td align="center" width='30%'>展品介绍</td>
					                <td align="center" width='30%'><input name="button" type="button" style="width: 96px" onclick="javascript:additem();" value="添加"/></td>
					            </tr>
             	 			</table>


js:
function additem()
{
    var row,cell,str;
    row = document.getElementById("exhibitsTr").insertRow();
    if(row != null )
    {
        cell = row.insertCell();
        cell.align="center";
        cell.innerHTML="<input style=\"text-align:center;\" type=\"text\" name=\"ZP_NAME\" readonly=\"readonly\" value= \"\">";
        cell = row.insertCell();
        cell.align="center";
        cell.innerHTML="<input style=\"text-align:center;\" type=\"text\" name=\"ZP_PIC\" readonly=\"readonly\" value= \"\">";
        cell = row.insertCell();
        cell.align="center";
        cell.innerHTML="<input style=\"text-align:center;\" type=\"text\" name=\"ZP_DESCRIPTION\" readonly=\"readonly\" value= \"\">";
        cell = row.insertCell();
        cell.align="center";
        cell.id = randomChar(10);
        cell.innerHTML="<input type=\"button\" value=\"删除\" onclick=\'deleteitem(this);\'>";
        count++;
    }
}
分享到:
评论

相关推荐

    table动态添加行并编辑

    JavaScript(js)作为客户端脚本语言,使得我们能够实现表格的动态交互功能,如动态添加行、行编辑以及行数据修改。下面我们将深入探讨这些知识点。 ### 1. 动态添加行 在HTML中,`&lt;table&gt;`元素用于创建表格,但...

    table 使用js 高效 动态添加行

    在网页开发中,表格(Table)是展示数据的常用元素,而JavaScript(js)则提供了强大的功能来操作DOM(文档对象模型),包括动态地向表格中添加行。本篇文章将详细探讨如何使用JavaScript高效地实现表格动态添加行,...

    js动态添加table行

    本文代码主要实现了javascript如何操作table并动态添加行的方法

    table动态添加行

    为了实现动态添加行的功能,我们需要借助`JavaScript`或者现代前端框架如`jQuery`、`Vue.js`、`React.js`等。这里我们以纯`JavaScript`为例,解释如何实现这个功能: 1. **事件监听**:首先,我们需要在某个元素...

    一个动态添加table行的js例子

    在JavaScript编程中,动态添加和删除表格行是一个常见的需求,特别是在网页交互和数据展示中。这个例子主要展示了如何使用JS实现这一功能。首先,我们来理解这个“动态添加table行的js例子”的核心知识点。 1. **...

    JavaScript table 动态添加行,列

    //创建一行 for(var i=0;i;i++){ var _tr=_table.insertRow(i); //创建八列 for(var j=0;j;j++){ var _td=_tr.insertCell(j); //var _tn=document.createTextNode(i.toString()+j.toString...

    jstable添加行删除行复制行

    在`jstable添加行删除行复制行.html`这个示例文件中,可以看到这些概念是如何具体实现的。通过阅读和理解代码,你可以更深入地学习如何利用JavaScript实现表格的动态管理。同时,也可以结合CSS和jQuery等库来增强...

    table JS 添加行和删除行

    在本话题中,我们将深入探讨如何使用JavaScript来添加和删除HTML表格(table)中的行。这对于构建数据展示或者管理界面非常实用。 首先,让我们了解HTML表格的基本结构。一个简单的HTML表格由`&lt;table&gt;`标签定义,每...

    js动态添加表(table、行).html

    js动态添加表(table、行).html 点击可直接运行,或查看源码

    利用jquery给指定的table动态添加一行、删除一行的方法

    这篇文章主要介绍了如何使用jQuery在指定的HTML表格(table)中动态地添加和删除行。jQuery是一种广泛使用的JavaScript库,它简化了DOM操作,包括在表格中动态修改内容。 首先,我们要理解HTML表格的基本结构,一个...

    HTML TABLE批量添加行与删除行

    HTML TABLE批量添加行与删除行.javascript实现。

    table动态增加删除行列

    使用javascript实现table动态增加删除行列。

    关于表格(table)中checkbox等相关事件操作(动态添加行+隔行换色等相关)(jquery)

    4. **动态添加行**:当需要在表格中动态添加行时,可以使用jQuery的`append()`方法。例如,创建一个新的行,包含两列,一列是文本,一列是复选框: ```javascript function addRow(text) { var newRow = $("&lt;tr&gt;...

    js table添加删除行

    js table添加、删除行。点“添加”按钮可以添加一行,每行后面都有一个删除按钮,可以删除所在行。

    javascript table 增加删除行,巧妙实现

    在JavaScript中,表格(Table)是网页数据展示的常用元素,而动态地增加或删除行则是常见的交互需求。本文将深入探讨如何巧妙地利用JavaScript来实现这个功能。 首先,我们需要了解HTML中的`&lt;table&gt;`元素及其相关...

    JQuery动态添加删除table行.

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

    JS动态添加、删除Table行排序(删除整行、删除整列)

    这篇教程将专注于如何使用JavaScript动态地添加、删除Table的行,并实现排序功能,包括删除整行和整列。以下是对这些概念的详细解释: 1. **动态添加Table行:** 要动态添加行,我们可以使用`document....

    js动态创建table点击按钮dom table tr添加操作

    本主题主要聚焦于如何利用JavaScript动态创建一个包含表格(table)的DOM结构,并且在表格行(tr)中添加可点击的按钮。这通常用于展示数据集,允许用户进行交互操作,比如删除、编辑或查看详情。 首先,我们需要...

Global site tag (gtag.js) - Google Analytics