最近做一个项目,需要对表格进行增行和删行。

研究了一下jquery操作dom的方法和事件委托原理,下面是我编写的例子,源码传上,欢迎高手指点。

功能:

支持在指定行下面增行;

支持删行指定行;

增行、删行后自动计算序号;使用table背景设置表格边框;

代码:

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Examples</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet">
<script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.js"></script>
<style type="text/css">
body{
font-size: 16px;
}
a{
text-decoration:none;
}
div.wrap{
width:%;
margin: auto;
}
table.list{
background-color: black;
width:%;
}
table.list td,table.list th{
background-color: white;
width:%;
line-height: 2em;
}
.hidden{
display:none;
}
.center{
text-align: center;
}
.orange{
color:orange;
}
a:hover{
color:blue;
font-weight: bold;
}
</style>
</head>
<body>
<div class="wrap">
<div class="list">
<h1 class="center">表格插件</h1>
<p class="orange">支持增行、删行</p>
<table class="list" >
<thead>
<tr>
<th>序号</th>
<th>姓名</th>
<th>成绩</th>
<th><a href="#" class="add">增行</a></th>
<th></th>
</tr>
</thead>
<tbody>
<tr class="trmodle hidden">
<td class="center"></td>
<td>
<select name="" id="">
<option value="">张三</option>
<option value="">李四</option>
<option value="">王五</option>
<option value="">赵五</option>
</select>
</td>
<td><input type="text" value="" /></td>
<td class="center"><a href="#" class="add">增行</a></td>
<td class="center"><a href="#" class="del">删行</a></td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
<script type="text/javascript">
$(function(){
//使用事件委托:解决新增元素事件绑定问题
$("table.list").on("click",function(e){
//console.log(e);
var v = e.target||srcElement;
if(v.nodeName.toLowerCase()=="a"){
//增行
if(v.className=="add"){
//复制模板行数据
var n = "<tr>"+$(".trmodle").eq().clone().html()+"</tr>";
//找到父级元素中的tr,然后在后面增加增行
$(v).parent().parent().after(n);
setIndex();
}
//删行
if(v.className=="del"){
$(v).parent().parent().remove();
setIndex();
}
}
});
});
//组织序号
function setIndex() {
var t = $("table.list tr");
t.each(function () {
$(this).children("td").eq().text($(this).index());
})
}
</script>
</html>

效果图:

aaarticlea/png;base64,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" alt="" />

表格(table) 插件:支持当前行增行、删除。使用事件委托的更多相关文章

  1. Web开发——HTML基础(HTML表格 <table>)

    参考: 表格属性参考:http://www.w3school.com.cn/tags/tag_table.asp 目录: 1.举例 2.表格 2.1 表格属性 2.2 表格的表头 2.3 表格中的空单 ...

  2. 好用的自适应表格插件-bootstrap table (支持固定表头)

    最近工作中找到了一款十分好用的表格插件,不但支持分页,样式,搜索,事件等等表格插件常有的功能外,最主要的就是他自带的冻结表头功能,让开发制作表格十分容易,不过网上大多都是英文文档,第一次使用会比较麻烦 ...

  3. FineUI大版本升级,外置ExtJS库、去AXD化、表格合计行、表格可编辑单元格的增删改、顶部菜单框架

    这是一篇很长的文章,在开始正文之前,请允许我代表目前排名前 20 中唯一的 .Net 开源软件 FineUI 拉下选票: 投票地址: https://code.csdn.net/2013OSSurve ...

  4. QRowTable表格控件-支持hover整行、checked整行、指定列排序等

    目录 一.开心一刻 二.嘴一嘴 三.效果展示 四.浅谈实现 五.自定义数据源 1.data函数 2.flags函数 六.自定义视图 1.目的 2.问题分析 七.测试 八.相关文章 原文链接:QRowT ...

  5. Qt实现表格控件-支持多级列表头、多级行表头、单元格合并、字体设置等

    目录 一.概述 二.效果展示 三.定制表头 1.重写数据源 2.重写QHeaderView 四.设置属性 五.相关文章 原文链接:Qt实现表格控件-支持多级列表头.多级行表头.单元格合并.字体设置等 ...

  6. [转]响应式表格jQuery插件 – Responsive tables

    本文转自:http://www.shejidaren.com/responsive-tables-for-bootstrap-3.html 这个Responsive tables jQuery插件依赖 ...

  7. FooTable高级的响应式表格jQuery插件

    FooTable是一个高级jQuery插件,允许开发者在触屏智能手机及平板电脑等小型设备上制作数据非常惊人的HTML表格.它可以将HTML表转换成可扩展的响应式表格,且通过单击某一行即可将该行数据隐藏 ...

  8. HTML——表格table标签,tr或者td

    表格定义和用法 <tr> 标签定义 HTML 表格中的行. tr 元素包含一个或多个 th 或 td 元素. HTML 与 XHTML 之间的差异 在 HTML 4.01 中,tr 元素的 ...

  9. jQuery html表格排序插件:tablesorter

    ablesort是一款很好用的jQuery表格排序插件. 支持多种数据类型排序,会自动识别表格内容数据类型,使用也非常方便. 使用jQuery tablesort实现html表格方法: 1. 下载jQ ...

随机推荐

  1. ref 关键字out关键字

    using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threa ...

  2. A - 高精度(大数)N次方(第二季水)

    Description Problems involving the computation of exact values of very large magnitude and precision ...

  3. 菜单之二:使用xml文件定义菜单

    参考<疯狂android讲义>2.10节 P174,参见归档project:XmlMenuDemo.zip 一般推荐使用XML文件定义菜单. 基本步骤如下: 1.定义布局文件 为简单显示原 ...

  4. 深刻理解Oracle数据库的启动和关闭 .

    Oracle数据库提供了几种不同的数据库启动和关闭方式,本文将详细介绍这些启动和关闭方式之间的区别以及它们各自不同的功能. 一.启动和关闭Oracle数据库 对于大多数Oracle DBA来说,启动和 ...

  5. iwebshop 改版页面

  6. js 获取浏览器内核

    <script language="JavaScript" type="text/javascript">    var browser = {   ...

  7. Inno Setup 安装前卸载原程序(转)

    很多時候我們需要在安裝文件之前卸載原有的程序而不是覆盖安装,本文的code就是实现了这样的功能. 实现原理是:從注冊表'UninstallString'項中读取卸载信息,用Exec进行静默卸载. 下面 ...

  8. Linux 备份工具

     Linux 备份工具 GNU 的传统备份工具  GNU tar — http://www.gnu.org/software/tar/ GNU cpio — http://www.gnu.org/so ...

  9. (译)linux系统关于命令echo的15个例子

    15 Practical Examples of ‘echo’ command in Linux By Avishek Kumar Under: Linux Commands On: August 2 ...

  10. 【HDU 4463 Outlets】最小生成树(prim,kruscal都可)

    以(x,y)坐标的形式给出n个点,修建若干条路使得所有点连通(其中有两个给出的特殊点必须相邻),求所有路的总长度的最小值. 因对所修的路的形状没有限制,所以可看成带权无向完全图,边权值为两点间距离.因 ...