`

推荐一个jquery排序分页插件

阅读更多
DATATABLES

致力于使用简单的页面客户端排序,分页jquery插件。推荐这个是因为自己用的时候相当容易。最简单使用如下:
1. 把你的table加个ID
2. 确保你的table有thead和tbody分别放th和td
3. 添加javascript lab
=javascript_include_tag "http://www.datatables.net/release-datatables/media/js/jquery.dataTables.js"
=stylesheet_link_tag "http://www.datatables.net/release-datatables/media/css/demo_table.css"
=stylesheet_link_tag "http://www.datatables.net/release-datatables/media/css/demo_page.css"

4. 添加jquery处理
$(document).ready(function() {
	$('#example').dataTable();
} );


5. 如果,你的字段里有数字的话,因为有数字的时候,默认js是安装string排的
需要修改如下:
注明,两种写法只用一个就可以,都是表明对应的字段类型的。
详细参考:
http://datatables.net/usage/columns#sType
/* Using aoColumnDefs */
$(document).ready(function() {
	$('#example').dataTable( {
		"aoColumnDefs": [ 
			{ "sType": "html", "aTargets": [ 0 ] }
		]
	} );
} );

/* Using aoColumns */
$(document).ready(function() {
	$('#example').dataTable( {
		"aoColumns": [ 
			{ "sType": "html" },
			null,
			null,
			null,
			null
		]
	} );
} );

效果演示demo


功能列表:
引用

Variable length pagination
On-the-fly filtering
Sorting with data type detection
Smart handling of column widths
Themeable by CSS
Hidden columns
Extremely customisable and flexible
Fully internationalisable
Dynamic creation of tables
Multi-column sorting
Custom DOM positioning
Single column filtering
Alternative pagination types
Non-destructive DOM interaction
Ajax auto loading of data
Type detection for dynamic data (and plugin support)
State saving
API plug-in mechanism
It's free!


分享到:
评论

相关推荐

    jQuery分页排序插件.zip

    1. 分页:jQuery分页插件能够将大量数据分割成多个小块,每个块对应一个页面,用户可以通过点击页码或导航按钮轻松浏览不同页面,提高数据浏览效率。 2. 排序:该插件支持对表格或其他HTML元素进行动态排序。用户...

    jQuery实现分页插件

    本文将深入探讨如何使用jQuery实现一个分页插件。 ### 1. jQuery分页原理 分页主要涉及两个关键概念:当前页数和每页显示的数据数量。jQuery分页插件通过计算总数据量和每页显示的数量来确定页码总数,并根据当前...

    jQuery表格分页排序插件.zip

    SlimTable是jQuery的一个插件,专门用于表格的分页和排序。这个插件的亮点在于其轻量级和高效性,即使在大数据量的情况下也能保持良好的性能。它能够快速地将普通的HTML表格转换为具有动态分页和排序功能的交互式...

    jquery插件--表格分页

    4. Paginate.js:一个轻量级的分页插件,易于集成,提供了基本的分页功能。 三、使用jQuery实现表格分页 1. 引入jQuery和分页插件:首先需要在HTML文件中引入jQuery库和选择的分页插件CSS/JS文件。 2. 初始化表格...

    jQuery表格数据分页插件代码

    在这个"jQuery表格数据分页插件代码"中,我们可以看到一个完整的实现,它允许用户按需加载和浏览数据,优化了用户体验。 1. **jQuery基础**:jQuery是一个广泛使用的JavaScript库,简化了HTML文档遍历、事件处理、...

    jquery 实现排序和分页

    `jquery.tablesorter` 是一个流行的 jQuery 插件,用于使表格数据具有排序功能。这个插件允许用户通过点击表头来对表格的列进行升序或降序排序。要使用它,首先需要在页面中引入 jQuery 和 tablesorter 的 CSS 及 ...

    jquery table分页插件

    **jQuery Table 分页插件详解** 在Web开发中,数据展示是常见的需求,尤其是在处理大量数据时,分页成为提高用户体验的重要手段。jQuery Table分页插件为开发者提供了便捷的解决方案,它允许用户轻松地在表格中实现...

    jQuery带分页动态数据表格插件

    本教程将深入讲解如何利用jQuery实现一个带分页的动态数据表格插件。 首先,我们需要理解jQuery的核心概念。jQuery通过提供易用的API,使得JavaScript代码更简洁、更高效。例如,`$(selector)`用于选取DOM元素,`....

    jQuery分页排序插件jPList.zip

    jQuery分页排序插件jPList是一款为网页数据展示提供强大功能的工具,它整合了分页、排序和过滤功能,使得用户可以更方便地在大量数据中进行交互。这款插件基于流行的JavaScript库jQuery构建,因此对于熟悉jQuery的...

    jquery实现分页插件

    综上所述,jQuery实现的分页插件是一个实用的工具,通过灵活配置和简单的API调用,可以帮助开发者快速实现高效、美观的分页功能。同时,其良好的可扩展性和自定义性使得它能适应各种项目需求。在实际开发中,结合...

    jquery排序分页分析理解

    3. **插件使用**: 为了简化分页功能,jQuery有许多成熟的分页插件,如jQuery Paginate、Bootstrap-Pagination等。它们提供丰富的选项和事件,易于集成到项目中。 **三、源码解析** 博客中可能详细解析了jQuery排序...

    jQuery分页排序插件jPList

    jPList是一个灵活的jQuery插件,支持排序、分页和过滤的HTML结构(DIVs, UL/LI, tables,等等)。演示地址:http://www.jq22.com/jquery-info452

    jquery分页插件使用

    一般而言,分页插件会提供一个.min.js格式的压缩文件,这有助于减少页面加载时间。 ```html <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script src="path/to/jquery.pagination.min.js...

    多款jQuery分页插件特效.zip

    jQuery,作为一个广泛使用的JavaScript库,提供了丰富的分页插件,使得开发者能够轻松实现功能丰富且效果美观的分页功能。本资源"多款jQuery分页插件特效.zip"包含了多种jQuery分页插件的代码示例,供开发者学习和...

    JQuery Ajax 分页插件 jquery_paginator

    **jQuery Ajax 分页插件 jquery_paginator 知识点详解** 在Web开发中,当页面数据量过大时,为了提高用户体验和加载速度,通常会采用分页技术来展示数据。jQuery是一个广泛使用的JavaScript库,提供了丰富的功能来...

    多款漂亮的jquery分页插件特效

    这是一个简单易用的jQuery分页插件,适合那些需要快速实现分页功能的项目。它支持自定义图标、颜色和页码显示,同时可以设定分页器的位置,如顶部、底部或两侧。 5. **jQuery Datatables** Datatables不仅是一个...

    jquery 表格分页处理插件 DataTables

    DataTables是提供了大量特性的强大jQuery表格插件。例如:你可以自动轻松筛选、Ajax预读取数据、分页、列排序、高亮排序列、扩展插件支持、使用CSS或jQuery UI ThemeRoller 定制主题和完整文档。

    jQuery实现的分页排序Table组件

    一个完整的jQuery分页排序Table组件通常包含HTML结构、CSS样式和JavaScript逻辑。HTML负责定义表格结构,CSS用于美化显示,JavaScript则处理交互逻辑,如分页和排序的事件处理。例如,可以使用jQuery插件如...

    JQuery排序分页

    一、jQuery排序 在jQuery中,对表格或列表进行排序可以通过插件如`jQuery.tablesorter`来实现。这个插件允许用户点击表头来对表格中的数据进行升序或降序排序。以下是一个基本的使用步骤: 1. 引入jQuery库和...

Global site tag (gtag.js) - Google Analytics