jQuery表排序 [英] jQuery table sort

问题描述

我有一个非常简单的HTML表格，包含4列：

I have a very simple HTML table with 4 columns:

Facility Name, Phone #, City, Specialty

我希望用户能够按设施名称和仅限城市进行排序。

I want the user to be able to sort by Facility name, and City only.

如何使用jQuery对此进行编码？

How can I code this using jQuery?

推荐答案

如果你想避免所有的钟声和口哨然后我可以建议这个简单的 sortElements 插件。用法：

If you want to avoid all the bells and whistles then may I suggest this simple sortElements plugin. Usage:

var table = $('table');

$('.sortable th')
    .wrapInner('<span title="sort this column"/>')
    .each(function(){

        var th = $(this),
            thIndex = th.index(),
            inverse = false;

        th.click(function(){

            table.find('td').filter(function(){

                return $(this).index() === thIndex;

            }).sortElements(function(a, b){

                if( $.text([a]) == $.text([b]) )
                    return 0;

                return $.text([a]) > $.text([b]) ?
                    inverse ? -1 : 1
                    : inverse ? 1 : -1;

            }, function(){

                // parentNode is the element we want to move
                return this.parentNode; 

            });

            inverse = !inverse;

        });

    });

和一个演示。 （点击城市和设施栏目标题进行排序）

And a demo. (click the "city" and "facility" column-headers to sort)

这篇关于jQuery表排序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！