/** ---------------------------------------------------------------------------
* 添加配件信息
* @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控制HTML表格增删行的实例,这在处理需要用户动态输入多条记录的场景时非常实用。 ### 标题解析:“javascript控制增删行” 这个标题简洁明了地指出了本文的核心...
通过这种方式,我们不仅实现了表格的动态增删行,还提供了友好的用户交互。同时,还可以根据实际需求进一步扩展,如增加编辑功能、数据排序、分页等。记住,JavaScript提供的强大DOM操作能力使我们在构建动态网页时...
首先,动态增删table是一种常见的用户界面设计,它允许用户在网页上添加或删除表格行,以满足动态管理数据的需求。在实现这一功能时,通常会使用JavaScript或者jQuery等前端库来处理用户的交互事件,如点击“添加”...
使用javascript实现table动态增加删除行列。
js 动态按行增删表格,删除使用复选框选中删除
动态增删表格行的纯JavaScript实现并不复杂,关键在于理解DOM操作和事件处理。通过创建和操作HTML元素,结合数据模型,我们可以轻松实现这一功能。在实际项目中,根据需求,可能还需要考虑数据的持久化、表单验证、...
总结,实现HTML表格的动态增删行列,关键在于理解和熟练运用JavaScript对DOM的操作。结合CSS和前端框架,可以创建出功能强大且用户体验良好的交互式表格。实际项目中,根据需求可以选择不同的实现方式,确保功能的...
在MVC(Model-View-Controller)架构中,结合C#后端,BootstrapTable可以实现数据的增删改查操作,提供用户友好的界面和高效的后台处理。 1. **BootstrapTable的基本结构** BootstrapTable的核心是HTML的`<table>`...
本话题主要探讨如何利用原生JavaScript和DOM来实现数据表格中的动态增删查改功能,这对于前端开发来说是一项基本且重要的技能。 1. **创建数据表格** - 使用`<table>`元素创建表格结构,包括`<thead>`定义表头,`...
然而,要实现动态增删改查,我们需要利用JavaScript。通过DOM(Document Object Model)操作,可以添加、删除或修改表格的行(`<tr>`)和单元格(`<td>`)。例如,可以添加一个“新增”按钮,当点击时,JS函数会在...
动态增删表格行主要涉及JavaScript操作这些元素。 在"add.html"文件中,可能包含以下基本结构: ```html <table id="myTable"> 列1 列2 <!-- ... --> 数据1 数据2 <!-- ... --> <!-- ... -->...
### JavaScript 实现的 Table 功能详解 在现代 Web 开发中,使用 JavaScript 来操作 DOM(文档对象模型)是常见的需求之一。通过 JavaScript,开发者可以动态地创建、更新或删除 HTML 元素,从而实现更加丰富的用户...
本文将深入探讨如何使用jQuery实现表格行的增删功能,以及多选删除的实现方法。 首先,我们需要了解HTML表格的基本结构。一个基本的表格由`<table>`元素、`<tr>`(表格行)元素、`<td>`(表格数据)元素组成。例如...
要实现对表格的增删查改,我们需要在JavaScript中操作这些元素。 **增加(Add)**: 在表格中添加新行,可以创建一个新的`<tr>`元素,并为其填充`<td>`元素,然后将其插入到表格的适当位置。例如,我们可以使用`...
为了使表格更易于阅读和理解,可以使用`.table-striped`类添加行间条纹,`.table-bordered`类添加边框,`.table-hover`类实现鼠标悬停时高亮显示行。 在实现增删改查功能时,通常会添加按钮或链接,这些可以通过`...
在本主题中,我们将深入探讨如何使用纯JavaScript来实现表格(table)的行增删功能,这对于创建数据管理界面或者用户输入表单的网页特别有用。 首先,我们需要了解HTML中的`<table>`元素。`<table>`是用于展示结构...
而jQuery库简化了JavaScript的使用,包括对AJAX的操作,使得开发者能够更加便捷地实现动态增删改查功能。 一、jQuery AJAX的基本用法 1. `$.ajax()`: 这是jQuery提供的核心AJAX函数,它接受一个包含各种选项的对象...
使用JavaScript,我们可以动态地生成和更新表格行 (`<tr>`)、单元格 (`<td>`) 或表头 (`<th>`), 以及与之相关的样式和事件。例如,我们可以通过 `document.createElement()` 创建新元素,再通过 `innerHTML` 或 `...
它提供了丰富的功能,如动态增删行、编辑等,使得Web应用的用户界面更加交互和灵活。下面将详细讲解jQuery Grid及其核心特性。 一、jQuery Grid简介 jQuery Grid,通常指的是JQGrid,是一款基于jQuery库的开源表格...