`
ianylb
  • 浏览: 74412 次
  • 性别: Icon_minigender_1
  • 来自: 厦门
社区版块
存档分类
最新评论

javascript动态增删table行

阅读更多
/** ---------------------------------------------------------------------------
* 添加配件信息
* @author yeliangbiao
------------------------------------------------------------------------------*/
function addPrepare(){
var prepareTable = $("prepareTable");
var tr = prepareTable.insertRow(prepareTable.rows.length);
var td1 = tr.insertCell();
var td2 = tr.insertCell();
var td3 = tr.insertCell();
var td4 = tr.insertCell();
var td5 = tr.insertCell();
td1.innerHTML = "<input type='hidden' name='prepareId' value='0'>";//用0表示是新添加的
td1.innerHTML = td1.innerHTML + "<input type='text' name='prepareName' class='input70' maxlength='32' width='100%'/>";
td2.innerHTML = "<input type='text' name='prepareBrand' class='input70' maxlength='16' width='100%'/>";
td3.innerHTML = "<input type='text' name='prepareStandard' class='input70' maxlength='16' width='100%'/>";
td4.innerHTML = "<input type='text' name='prepareSum' class='input70' maxlength='10' width='100%' onkeyup='clearNoNum(this)'/>";
td5.innerHTML = "<div align='center'><a href='#' onclick='delPrepare()'>删除</a></div>";
}
//删除一条配件信息
function delPrepare(){
var index = event.srcElement.parentNode.parentNode.parentNode.rowIndex;
$("prepareTable").deleteRow(index);
}
分享到:
评论

相关推荐

    javascript控制增删行

    在给定的代码示例中,我们看到了一个利用JavaScript控制HTML表格增删行的实例,这在处理需要用户动态输入多条记录的场景时非常实用。 ### 标题解析:“javascript控制增删行” 这个标题简洁明了地指出了本文的核心...

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

    通过这种方式,我们不仅实现了表格的动态增删行,还提供了友好的用户交互。同时,还可以根据实际需求进一步扩展,如增加编辑功能、数据排序、分页等。记住,JavaScript提供的强大DOM操作能力使我们在构建动态网页时...

    动态增删table以及后台传值和弹出窗口父子窗口传值

    首先,动态增删table是一种常见的用户界面设计,它允许用户在网页上添加或删除表格行,以满足动态管理数据的需求。在实现这一功能时,通常会使用JavaScript或者jQuery等前端库来处理用户的交互事件,如点击“添加”...

    table动态增加删除行列

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

    js 动态增删表格行

    js 动态按行增删表格,删除使用复选框选中删除

    动态增删表格行(纯JS写法) 归档

    动态增删表格行的纯JavaScript实现并不复杂,关键在于理解DOM操作和事件处理。通过创建和操作HTML元素,结合数据模型,我们可以轻松实现这一功能。在实际项目中,根据需求,可能还需要考虑数据的持久化、表单验证、...

    table表单增删行列例子

    总结,实现HTML表格的动态增删行列,关键在于理解和熟练运用JavaScript对DOM的操作。结合CSS和前端框架,可以创建出功能强大且用户体验良好的交互式表格。实际项目中,根据需求可以选择不同的实现方式,确保功能的...

    BootStrapTable实现增删改查

    在MVC(Model-View-Controller)架构中,结合C#后端,BootstrapTable可以实现数据的增删改查操作,提供用户友好的界面和高效的后台处理。 1. **BootstrapTable的基本结构** BootstrapTable的核心是HTML的`&lt;table&gt;`...

    js表格操作,DOM实现数据动态增删查改

    本话题主要探讨如何利用原生JavaScript和DOM来实现数据表格中的动态增删查改功能,这对于前端开发来说是一项基本且重要的技能。 1. **创建数据表格** - 使用`&lt;table&gt;`元素创建表格结构,包括`&lt;thead&gt;`定义表头,`...

    js+html写的实现表格的动态增删改查和表单验证

    然而,要实现动态增删改查,我们需要利用JavaScript。通过DOM(Document Object Model)操作,可以添加、删除或修改表格的行(`&lt;tr&gt;`)和单元格(`&lt;td&gt;`)。例如,可以添加一个“新增”按钮,当点击时,JS函数会在...

    动态增删表格行的JS代码分析 - gaochc的专栏 - CSDNBlog

    动态增删表格行主要涉及JavaScript操作这些元素。 在"add.html"文件中,可能包含以下基本结构: ```html &lt;table id="myTable"&gt; 列1 列2 &lt;!-- ... --&gt; 数据1 数据2 &lt;!-- ... --&gt; &lt;!-- ... --&gt;...

    JavaScript写的table增、批量删、模糊查询、文本框编辑

    ### JavaScript 实现的 Table 功能详解 在现代 Web 开发中,使用 JavaScript 来操作 DOM(文档对象模型)是常见的需求之一。通过 JavaScript,开发者可以动态地创建、更新或删除 HTML 元素,从而实现更加丰富的用户...

    jquery对表格行增删操作

    本文将深入探讨如何使用jQuery实现表格行的增删功能,以及多选删除的实现方法。 首先,我们需要了解HTML表格的基本结构。一个基本的表格由`&lt;table&gt;`元素、`&lt;tr&gt;`(表格行)元素、`&lt;td&gt;`(表格数据)元素组成。例如...

    js实现对表格的增删查改

    要实现对表格的增删查改,我们需要在JavaScript中操作这些元素。 **增加(Add)**: 在表格中添加新行,可以创建一个新的`&lt;tr&gt;`元素,并为其填充`&lt;td&gt;`元素,然后将其插入到表格的适当位置。例如,我们可以使用`...

    bootstrap 带增删改查 表格

    为了使表格更易于阅读和理解,可以使用`.table-striped`类添加行间条纹,`.table-bordered`类添加边框,`.table-hover`类实现鼠标悬停时高亮显示行。 在实现增删改查功能时,通常会添加按钮或链接,这些可以通过`...

    纯javascript增加删除表格行

    在本主题中,我们将深入探讨如何使用纯JavaScript来实现表格(table)的行增删功能,这对于创建数据管理界面或者用户输入表单的网页特别有用。 首先,我们需要了解HTML中的`&lt;table&gt;`元素。`&lt;table&gt;`是用于展示结构...

    Jquery Ajax动态增删改查

    而jQuery库简化了JavaScript的使用,包括对AJAX的操作,使得开发者能够更加便捷地实现动态增删改查功能。 一、jQuery AJAX的基本用法 1. `$.ajax()`: 这是jQuery提供的核心AJAX函数,它接受一个包含各种选项的对象...

    js 动态表格增 删 查 改

    使用JavaScript,我们可以动态地生成和更新表格行 (`&lt;tr&gt;`)、单元格 (`&lt;td&gt;`) 或表头 (`&lt;th&gt;`), 以及与之相关的样式和事件。例如,我们可以通过 `document.createElement()` 创建新元素,再通过 `innerHTML` 或 `...

    jquery 可动态增行,动态编辑,删除的grid

    它提供了丰富的功能,如动态增删行、编辑等,使得Web应用的用户界面更加交互和灵活。下面将详细讲解jQuery Grid及其核心特性。 一、jQuery Grid简介 jQuery Grid,通常指的是JQGrid,是一款基于jQuery库的开源表格...

Global site tag (gtag.js) - Google Analytics