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

研究了一下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. C#抓取网页内容

    学习材料一 <C#抓取网页数据分析> 抓取Web网页数据分析 HttpWebRequest 和 HttpWebResponse 的应用

  2. Unique Binary Search Trees In JAVA

    Given n, how many structurally unique BST's (binary search trees) that store values 1...n? For examp ...

  3. ANCS协议翻译

    综述 苹果通知中心(Apple Notification Center Service, ANCS)的目的是提供给蓝牙外设一种简单.方便的获取ios设备通知信息的方式. 依赖 ANCS的使用没有依赖, ...

  4. [Linked List]Reorder List

    otal Accepted: 54991 Total Submissions: 252600 Difficulty: Medium Given a singly linked list L: L0→L ...

  5. 从汇编看c++成员函数指针(二)

    下面先看一段c++源码: #include <cstdio> using namespace std; class X { public: virtual int get1() { ; } ...

  6. 《JavaScript权威指南》读书笔记2

    3.6-3.8 这三章主要介绍了JS的包装对象.不可变的原始值和可变的对象引用.JS中的类型转换. 包装对象主要指当原始值需要调用一些方法的时候(原始值本身是不能通过"."来调用的 ...

  7. jQuery中的DOM操作总结

    jQuery中的DOM操作 DOM是Document Object Medel的缩写,它的意思是文档对象模型,根据W3C的官方说法,DOM是一种跟浏览器,平台以及语言都没有关系的一种规范,也就是一种接 ...

  8. maven+springmvc+easyui+fastjson+pagehelper

    1.maven配置 <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www ...

  9. Flask把变量注册到模板中

    使用python的Flask框架时,参考<Flask Web开发>一书时,发现书中可以在全局使用Permission.FOLLOW变量. 但是自己在尝试是,确提示变量没有定义.经过搜索,找 ...

  10. 【温故而知新-JQ的节点类型】

    来源:http://www.hi-docs.com/jquery/contents.html 定义和用法 查找匹配元素内部所有的子节点(包括文本节点).如果元素是一个iframe,则查找文档内容 语法 ...