`
wyf
  • 浏览: 435712 次
  • 性别: Icon_minigender_1
  • 来自: 唐山
社区版块
存档分类
最新评论

利用jquery给指定的table添加一行、删除一行

阅读更多

 

<table id="table6" class="caseTable">
            <tbody id="tbody6">
                <tr class="template repeat">
                    <td id="t1" class="btd">
                        商品名或通用名
                    </td>
                    <td id="t2" class="btd">
                        给药次数(次/日)
                    </td>
                    <td id="t3" class="btd">
                        每次用药量(/次)
                    </td>
                    <td id="t4" class="btd">
                        使用原因
                    </td>
                    <td id="t5" class="btd">
                        开始日期
                    </td>
                    <td id="t6" class="btd">
                        结束日期
                    </td>
                    <td id="t7" class="btd">
                        末次就诊时是否仍在使用
                    </td>
<td><a class="del" href="#"></a></td>
                </tr>
            </tbody>
        </table>

 

上面是模板表格

 添加一个按钮

 

 <input id="btnAdd" class="btn3_mouseout" type="button" value="添  加" /></div>

 添加js

 

 $("#tbody6>.template")
                //连同事件一起复制   
               .clone(true)
                //去除模板标记   
                .removeClass("template")
                //修改内部元素   
                .find(".content")
                .text("所要添加的信息"
                )
                .end()
                .find(".del")
                .text("删除")
                .end()
                //插入表格
                .appendTo($("#tbody6"))

 删除事件

    //表格的删除按钮事件绑定   
            $("#tbody6 .del").click(function() {
                $(this).parents(".repeat").remove();
            });
 

 

分享到:
评论

相关推荐

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

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

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

    支持在任意行添加一行且可配置的,如可在第一行添加一行、第二行添加一行、倒数第一行添加一行、倒数第二行添加一行,随需求的变化都不会影响。 前提条件:行数需在表中存在否则添加不成功。 2)、删除一行 支持动态...

    jQuery获取table下某一行某一列的值实现代码

    从提供的文件内容中,我们可以提取以下关于jQuery获取表格中某一行某一列值的知识点: 1. jQuery选择器的使用:在文中,通过使用选择器 $(".div") 找到了包含多个表格的div元素。这说明了jQuery选择器用于选取页面...

    jQuery选中table第一行或第一列

    通过jQuery选取table的第一行,第一列。

    jQuery删除table指定行

    删除表格中指定行的关键在于定位到这一行。我们可以使用类选择器、ID选择器或者索引选择器来实现。 例如,假设我们有一个表格,其中的行都有唯一的类名,如`"myRow"`,我们可以通过以下方式删除类名为`"myRow"`的行...

    jquery table 添加、删除行、列

    一个基本的表格由`&lt;table&gt;`元素开始,包含若干`&lt;tr&gt;`(表格行)元素,每一行内又有若干`&lt;td&gt;`(表格数据单元格)或`&lt;th&gt;`(表头单元格)元素。现在我们来看如何用jQuery来操作这些元素。 ### 添加行 添加行通常涉及...

    利用jquery超级简单实现添加行删除行

    在本文中,我们将深入探讨如何利用jQuery这一强大的JavaScript库来实现表格中动态添加和删除行的功能。这个功能在许多Web应用程序中都非常常见,比如在线表单、数据管理界面等。jQuery以其简洁的API和丰富的插件,...

    jQuery给指定的table动态添加删除行的操作方法

    本文将详细讲解如何使用jQuery给指定的table动态添加和删除行,并提供相应的代码示例。 首先,jQuery的选择器是实现这些操作的关键。`$("#mytable tr").find("td:nth-child(1)")` 和 `$("#mytable tr").find("td:...

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

    以上代码片段展示了如何利用jQuery实现表格的动态添加、编辑和删除功能。实际应用中,可能还需要考虑数据验证、错误处理和用户交互优化等细节。此外,对于大型项目,可能需要使用更复杂的表格插件,如DataTables或...

    jquery table 添加、删除行、列 utf-8

    由于表格的列是并排的,删除某一列需要遍历每一行: ```javascript // 获取要删除的列索引 var colIndexToRemove = 1; // 假设我们要删除第二列 // 遍历每行并删除指定索引的单元格 $("#myTable tbody tr").each...

    JQuery动态添加删除table行.

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

    使用jQuery为表格添加合计行

    使用jQuery为表格添加合计行,方法依赖jQuery,方法中使用到的JQ是jQuery中的$方法的别名

    jQuery实现动态给table赋值的方法示例

    表格的每一行都有三个单元格,分别用于显示昵称、加入时间和签名。 ```html &lt;table class="layui-table" lay-skin="line" id="datas"&gt; 昵称 加入时间 签名 &lt;td id="id"&gt;&lt;/td&gt; ...

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

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

    jquery table 上下行移动互换

    在实际应用中,可能还需要考虑行的边界条件,例如当试图将第一行上移或最后一行下移时,应防止出现无效的操作。此外,为了提供更好的用户体验,可以考虑添加一些视觉反馈,比如禁用无法操作的按钮,或者在交换行时...

    Jquery实现的table最后一行添加样式的代码

    在给定的标题和描述中,我们关注的是如何使用 jQuery 来给 HTML 表格(table)的最后一行添加特定的样式,以增强视觉效果和用户体验。以下是一个详细的解释和扩展这个功能的方法。 首先,我们需要了解 HTML 的 `...

    table JS 添加行和删除行

    一个简单的HTML表格由`&lt;table&gt;`标签定义,每一行由`&lt;tr&gt;`标签表示,而单元格(cells)则由`&lt;td&gt;`或`&lt;th&gt;`(表头)标签组成。例如: ```html &lt;table&gt; 数据1 数据2 数据3 数据4 &lt;/table&gt; ``` **添加行:...

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

    本篇将详细探讨如何利用jQuery实现表格中checkbox的相关事件操作,包括动态添加行、隔行换色、选中变色、全选与反选等功能。 首先,让我们了解jQuery的基本概念。jQuery是一个快速、简洁的JavaScript库,它简化了...

Global site tag (gtag.js) - Google Analytics