18个最好的 jQuery 表格插件
2011-05-17 19:49:06 来源:本站整理我们一般使用HTML表格来显示数据,我们都知道div更容易设计,更灵活。但是现在你使用这些精彩的jQuery表格插件,将更简单、灵活、更多风格。
本篇文章介绍了18个非常不错的jQuery 表格插件,。
1. DataTables
DataTables是一个jQuery的表格插件。这是一个高度灵活的工具,依据的基础逐步增强,这将增加先进的互动控制,支持任何HTML表格。View Live Demo
2. tablesorter
Tablesorter 是一个用来直接在浏览器上对表格数据进行排序的jQuery插件,无需再次刷新页面,支持多种单元格数据类型,例如数值、字符串、日期和自定义排序。
View Live Demo
3. uiTableFilter
uiTableFilter 是一个用来过滤表格中的列的jQuery插件。
View Live Demo
4. columnHover
jQuery插件,可以当鼠标悬停时,可以高亮表格中的整个列。View Live Demo
5. Scrollable HTML table plugin for jQuery
Scrollable HTML Table 这个 jQuery 插件用来在一个固定高度的表格中显示滚动行的数据,
View Live Demo
6. columnManager
columnManager是可以控制任意表格列显示或隐藏的jQuery插件,而且它可以保存当前表格的状态至你下次访问。这个jQuery插件非常小巧轻量,仅3.6kb。
View Live Demo
7. Flexigrid
Flexigrid是一个类似于Ext Gird,但基于jQuery开发的Grid。它具有的功能包括:可以调整列宽,合并列标题,分页,排序,显示/隐藏表格等。Flexigrid显示的数据能够通过Ajax获取或者从一个普通的表格转换。
View Live Demo
8. Table Drag and Drop JQuery plugin
只需要加入如下代码 <script type="text/javascript"> $(document).ready(function() { // Initialise the table $("#table-1").tableDnD(); }); </script>即可随便拖动列。
View Live Demo
9. HeatColor
HeatColor可以让你根据元素的值来为元素设置颜色。 它的值的比对时根据预设的一个范围来进行比较,最后对他们自动进行颜色值的设置。
View Live Demo
10. JQTreeTable
使用JQTreeTable插件你可以得到一个树形表格,如果用户的浏览器禁用了JavaScript,那么他们也能看到普通形式的表格,并不影响可访问性。
View Live Demo
11. FireScope Grid
FireScope Grid 是一个 jQuery 插件,用 HTML 表格增加了数据表格的常用功能,这些功能都在客户端上直接完成。
View Live Demo
12. Ingrid
Ingrid 是一个 jQuery 的电子数字表格插件,主要功能有列宽度变化、分页、行和列的样式等。
View Live Demo
13. 动态排序数据表格jQuery插件– jTPS
jTPS jQuery数据表格插件,提供动态滚动、排页等功能,开发版本仅15Kb。
View Live Demo
14. PicNet Table Filter
该jQuery插件增加了实时类Google列表过滤功能到HTML表格。该开源项目基于MIT协议。
View Live Demo
15. TableSort
original table sort script的重写,包括一些更多的功能,更快的排序架构。
View Live Demo
16. Fixed Header Table
这是一个可以固定表头的jQuery插件。当表格向下滚动时,表头不会跟着动。
View Live Demo
17. 拓展你的表格– jExpand plugin
jExpand是一个可以让表格具备可伸缩功能的jQuery插件。利用这个功能可以帮助你更好地组织表格,让表格承载更多的消息比如图片,列表,图表和其它元素。
View Live Demo
18. TableEditor
TableEditor 提供了灵活的对表格进行即时编辑功能,用户可自定义编辑的处理函数,例如调用 Ajax 方法更新数据等。
View Live Demo
- ››jquery .ajax方法 异步表单,接收服务器返回的数据...
- ››jquery 添加\删除 cookie
- ››jquery 正则表达式判断是否为正确邮箱格式
- ››jQuery EasyUI 数字框(NumberBox)用法
- ››JQuery中对option的添加、删除、取值
- ››JQuery实现下拉,单选,复选三大控件方法,
- ››jquery实现判断输入文字个数的代码
- ››jQuery bxCarousel实现图片滚动切换效果
- ››jQuery弹性滑动导航菜单
- ››jquery实现全选反选功能
- ››jQuery 屏蔽单个元素使用户无法点击
- ››jquery做复选框的全选、全部选、反选更加简单
更多精彩
赞助商链接