资讯频道 → Web前端
阅读更多

9顶
0踩

Web前端

翻译新闻 15 个实用的 jQuery 排序插件

2012-07-18 16:27 by 见习记者 csdn_0000 评论(3) 有17892人浏览
jquery javascript 插件 排序
如果你的应用中包含大型数据集，比如列表等，那么排序是非常必要的。另外，你还可以使用排序功能来管理页面中的模块。

在这篇文章中，我们整理了15个使用方便的jQuery排序插件。通过这些插件，你将可以轻松对页面或表格元素进行排列、重组。

1. Sortable Lists using jQuery UI

jQuery Interface插件和jQuery UI都可以用来对元素进行排序。本教程运用第二个插件，并介绍了保存排序结果的方法。



源码/演示

2. jQuery jPlist

jPlist是一个用法灵活的插件，可以完成对任何HTML结构（DIV、UL/LI、表等）的排序、分页和过滤。



源码/演示

3. jQuery Simple Content Sorting Plus Plugin

此插件可以自动筛选出符合条件的列表，同时也可以通过分页形式查看内容。该插件通过灵活的用户分类机制创造了简单方便的美化界面的方法。



源码/演示

4. jQuery UI Sortable

可用于对一组DOM元素进行排序。



源码+演示

5. jQuery Interface Elements

Interface是一个丰富界面组件的集合，基于jQuery，可帮助你轻松创建丰富的web应用程序和界面。



源码/演示

6. TinySort

TinySort是一个小而简单的jQuery插件，它可以通过内容前缀或属性值对节点或者子节点进行排序。



源码+演示

7. JSquared

此插件允许你组织高级搜索界面中的元素，就像Google Squared一样。



源码+演示

8. Animated table sort

此插件为你提供了生动的排序方式。通过选择表中列单元格的不同属性，包括它们的内容、数值，或是单元格中的子元素来改变元素的排列顺序。



源码+演示

9. table sorter

此插件可以将带有THEAD和TBODY标签的标准HTML表转化成可排序表，而无需刷新页面。Table sorter可以成功地解析多种类型的数据并进行排序。



源码/演示

10. jQuery Table

这是一个操作简单的jQuery插件，可帮助你将数据创建成可排序的表格。



源码/演示

11. jSorted排序插件

此插件可以对无序列表进行升序或降序排列，通过每个项目的附加属性（数字或日期）来排序。它可用于实时数据、图表、活动小部件、新闻行情、HTML5游戏和许多别的方面。



源码/演示

12. Simple Content Sorting

这个插件允许你通过简单的、配备分页功能的界面对内容进行排序，并且无需重新加载页面，因为它是用JavaScrip实现的。



源码/演示

13. Beautiful Data

这是个了不起的方法，可以为枯燥的HTML表增加分页和排序功能。此插件也可以用于指定了源文件的CSV和JSON数据。



源码/演示

14. jQuery columnManager 插件

此插件可以切换表中纵列内容的可见性（折叠和展开它们），并且保存数据直到下次访问。



源码/演示

15. Drag & Drop Sortable Lists with JavaScript and CSS

这是一个在主流浏览器中排序操作的示例集合，每个示例代表一种理念。



源码+演示

英文原文：jQuery Sort Plugins 15 of the Best
  • 大小: 77.3 KB
  • 大小: 71.1 KB
  • 大小: 57.8 KB
  • 大小: 73.2 KB
  • 大小: 50.8 KB
  • 大小: 59.4 KB
  • 大小: 66 KB
  • 大小: 63.6 KB
  • 大小: 80.9 KB
  • 大小: 57.5 KB
  • 大小: 81 KB
  • 大小: 71.9 KB
  • 大小: 80.8 KB
  • 大小: 74.4 KB
  • 大小: 49.2 KB
9
顶
0
踩
评论 共 3 条 请登录后发表评论
3 楼 vanner007 2012-07-20 09:30
开源才是王道！
2 楼 梁温陵 2012-07-19 15:31
都是要花钱的啊
1 楼 田梦桦 2012-07-19 13:26
强大的JQUERY

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Global site tag (gtag.js) - Google Analytics