`
cannysqurrel
  • 浏览: 14386 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
文章分类
社区版块
存档分类
最新评论

jquery动态添加附件(jquery table tr)

阅读更多
//HTML

<a href="javascript:void(0)" onclick="AddAttachment()">[点击添加附件]</a>

<table cellpadding="0" cellspacing="3" id="id_attachmentpanel"></table>

=========================================================

//新增文章页面
    function AddAttachment() {
        var objTable = $("#id_attachmentpanel");
        var intCount = $("#id_attachmentpanel tr").children().size() / 2 + 1;
        if (intCount > 5) { alert("附件不能超过5个"); return; }
        objTable.append("<tr><td>" + intCount + ". <input type='file' name='file" + intCount + "' onchange='FileExtChecking(this,1)' /></td><td><a href='javascript:void(0)' onclick='AddAttachment()'>[增加]</a><a href='javascript:void(0);' onclick='DisposeTr(this)'>[取消]</a></td></tr>");
        $("#id_attachmentpanel a").hide();
        $("#id_attachmentpanel a").last().show();
        if (intCount < 5) { $("#id_attachmentpanel a").last().prev().show(); }
    }
    function DisposeTr(arg_obj_item) {
        var objTr = $(arg_obj_item).parent().parent();
        objTr.remove();
        $("#id_attachmentpanel a").last().show();
        $("#id_attachmentpanel a").last().prev().show();
    }

============================================================

//编辑文章页面


    function AddAttachment() {
        var intAttach = '<%=intAttach %>';
        var objTable = $("#id_attachmentpanel");
        var intCount = $("#id_attachmentpanel tr").children().size() / 2 + 1;
        if (intCount > (5-intAttach)) { alert("附件不能超过5个"); return; }
        objTable.append("<tr><td>" + intCount + ". <input type='file' name='file" + intCount + "' onchange='FileExtChecking(this,1);' /></td><td><a href='javascript:void(0)' onclick='AddAttachment()'>[增加]</a><a href='javascript:void(0);' onclick='DisposeTr(this)'>[取消]</a></td></tr>");
        $("#id_attachmentpanel a").hide();
        $("#id_attachmentpanel a").last().show();
        if (intCount < (5-intAttach)) { $("#id_attachmentpanel a").last().prev().show(); }
    });
    function DisposeTr(arg_obj_item) {
        var objTr = $(arg_obj_item).parent().parent();
        objTr.remove();
        $("#id_attachmentpanel a").last().show();
        $("#id_attachmentpanel a").last().prev().show();
    }

==========================================
分享到:
评论

相关推荐

    jQuery+ajax实现动态添加表格tr td功能示例

    ### jQuery+ajax实现动态添加表格tr td功能 在进行Web开发时,我们经常需要动态地从服务器获取数据,并将这些数据展示在网页上。表格是展示这些数据的一种常见形式。本文将详细解析使用jQuery和ajax技术来实现动态...

    jQuery动态添加table

    本文将围绕“jQuery动态添加table”这一主题进行深入探讨,结合给出的资源,我们可以学习如何利用jQuery高效地在网页上动态创建和操作表格。 首先,我们来看“jQuery动态添加table”的基本概念。在网页设计中,...

    JQuery 动态生成DIV、Table并处理数据

    标题 "JQuery 动态生成DIV、Table并处理数据" 涉及的是使用JavaScript库JQuery来动态创建HTML元素,特别是DIV和Table,并且处理其中的数据。这在Web开发中非常常见,尤其是在构建交互式用户界面时。下面将详细阐述这...

    JQuery动态添加删除table行.

    要使用jQuery动态添加表格行,可以编写一个函数,根据需要插入新的行数据。以下是一个简单的示例: ```javascript function addRow(name, age) { var newRow = $("&lt;tr&gt;&lt;td&gt;" + name + "&lt;/td&gt;&lt;td&gt;" + age + "&lt;/td&gt;...

    jQuery实现动态添加tr到table的方法

    在本文中,我们将深入探讨如何使用jQuery来动态地向HTML表格(table)中添加行(tr)。这个功能在处理用户输入、数据展示或构建交互式Web应用时非常常见。通过以下示例,我们可以看到如何结合JavaScript和jQuery实现...

    jquery 动态添加控件

    本篇文章将深入探讨如何使用jQuery动态添加控件,包括元素的创建、插入和绑定事件,以及在实际项目中的应用。 首先,我们来了解jQuery如何创建新的HTML元素。在JavaScript中,创建元素通常是通过`document....

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

    本篇文章将深入探讨如何使用jQuery来动态地给HTML表格(table)赋值,通过一个具体的实例来展示相关技巧。 首先,我们需要一个基本的HTML结构,包含一个具有特定类和ID的table元素。在这个例子中,我们有一个layui...

    jQuery 动态添加或删除表格行

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

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

    总的来说,实现动态添加和删除表格行的基本步骤如下: 1. 选择表格和行:使用jQuery选择器定位到表格和目标行。 2. 创建新行:准备要插入的新行的HTML代码。 3. 插入行:使用`.after()`或`.before()`方法在适当的...

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

    本教程将深入探讨如何使用jQuery实现动态更改table表格数据,让你的网页表格具有实时编辑功能,提升用户体验。 首先,我们需要理解HTML表格的基本结构。一个基本的表格由`&lt;table&gt;`元素开始,包含若干个`&lt;tr&gt;`(行)...

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

    本示例“jquery表格动态添加删除行代码”利用jQuery的强大功能,为用户提供了一个直观且用户友好的表格管理体验。这个代码实现了一个功能,即在表格中动态地添加和删除行,这对于数据展示和编辑是非常实用的。 首先...

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

    本文将深入探讨如何使用jQuery实现表格的动态添加和删除行功能,这在许多网页应用中是非常常见的需求。 首先,让我们理解基本概念。在HTML中,表格由`&lt;table&gt;`元素定义,每行由`&lt;tr&gt;`元素表示,而单元格则由`&lt;td&gt;`...

    jQuery实现table中的tr上下移动并保持序号不变

    本示例主要关注如何利用jQuery实现在HTML表格(table)中移动行(tr)的同时保持行内的序号不变,这对于数据排序或用户交互有着重要的应用。我们将探讨以下关键知识点: 1. jQuery选择器与DOM操作: jQuery提供了...

    jQuery动态生成隔行变色的table

    这里的`&lt;table&gt;`元素有一个ID `dynamicTable`,我们将用jQuery选择这个元素并动态添加数据。 2. **CSS样式**: CSS用于设置隔行变色的样式。可以创建如下样式: ```css #dynamicTable tbody tr:nth-child(even)...

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

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

    jQuery实现为table表格动态添加或删除tr功能示例

    本文实例讲述了jQuery实现为table表格动态添加或删除tr功能。分享给大家供大家参考,具体如下: HTML页面元素如下: &lt;!-- 订单明细dialog --&gt; 销售订单明细 xss=removed&gt; &lt;table class=exhibit_table id=...

    基于Jquery的前台按表头排序table tr th

    在网页开发中,数据展示通常会使用到表格(table)元素,而为了提供更好的用户体验,我们经常需要实现表格数据的动态排序功能。本教程将详细讲解如何使用Jquery库实现前端表格(table)按表头(th)进行排序。Jquery...

    jquery动态添加删除

    ### jQuery 动态添加删除知识点解析 #### 一、概述 在Web开发中,动态地对页面元素进行增删操作是十分常见的需求。利用jQuery框架,开发者可以方便地实现这一功能。本文将根据提供的示例代码,深入分析如何使用...

Global site tag (gtag.js) - Google Analytics