客户端排序--jquery排序

前天，同事问我，jquery可不可以排序，我就有点发蒙，我说你在服务器端排吧，linq排起来很容易的，不过被否决了。（不过最终还是linq排的，但那是后话，下次说怎么做）

我就google了下，别说，还真有，我就想嘛，jquery的迭代器那么强大，怎么也会有能排序的。

具体哪里找的忘记了，不过作者的地址还有http://github.com/razorjack/jquery.sorted

body里的内容很简单：

    <div>
        <ul>
            <li data-id="9">one</li>
            <li data-id="8">two</li>
            <li data-id="7">three</li>
        </ul>
        <input type="button" value="排序" />
    </div>

然后是脚本了，这个是排序的脚本，我放到了一个js文件里

/*

jquery.sorted - super simple jQuery sorting utility

Copyright (c) 2010 Jacek Galanciak

Dual licensed under the MIT and GPL version 2 licenses.

http://github.com/jquery/jquery/blob/master/MIT-LICENSE.txt

http://github.com/jquery/jquery/blob/master/GPL-LICENSE.txt

Github/docs site: http://github.com/razorjack/jquery.sorted

*/

(function ($) {
    $.fn.sorted = function (customOptions) {

        var options = {
            reversed: false,
            by: function (a) { return a.text(); }
        };

        $.extend(options, customOptions);

        $data = $(this);
        arr = $data.get();
        arr.sort(function (a, b) {
            var valA = options.by($(a));
            var valB = options.by($(b));
            if (options.reversed) {
                return (valA < valB) ? 1 : (valA > valB) ? -1 : 0;
            } else {
                return (valA < valB) ? -1 : (valA > valB) ? 1 : 0;
            }
        });
        return $(arr);
    };
})(jQuery);

下面是引入脚本文件：

<script src="http://www.cnblogs.com/Scripts/jquery-1.4.4-vsdoc.js" type="text/javascript"></script>
    <script src="http://www.cnblogs.com/Scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
    <script src="http://www.cnblogs.com/Scripts/JScript1.js" type="text/javascript"></script>
    <script type="text/javascript" language="javascript">
        $(function () {
            $("input").click(function () {

                for (i = 0; i < $("ul li").sorted().length; i++) {
                    alert($("ul li").sorted().eq(i).html());
                }
            });
        });
    </script>
</head>

其实我一开始想的是，直接就排序了，不过最后发现不是这样，而是把结果存到了对象里，自己去取，呵呵。

具体的东西其实一试就知道了。这东西挺有意思的，或许用处不大，不过我想说的是，牛人真多啊。