Question

我遇到的问题与此问题非常相似：jQuery table sort

单击Date标题时，我想根据日期对表行进行排序，而不是基于文本。

我的代码基于这个jsFiddle http://jsfiddle.net/gFzCk/，这是上述问题的答案之一，它确实排序，但它将日期视为普通文本，而不是日期。

通常我可以修改原始代码以满足我的需要，但这段代码只是我的一点点。

HTML

<table>
    <tr>
        <th id="dateHeader">Date</th>
        <th>Phone #</th>
        <th id="city_header">City</th>
        <th>Speciality</th>
    </tr>
    <tr>
        <td>01/02/2013</td>
        <td>00001111</td>
        <td>Amsterdam</td>
        <td>GGG</td>
    </tr>
    <tr>
        <td>24/02/2013</td>
        <td>55544444</td>
        <td>London</td>
        <td>MMM</td>
    </tr>
    <tr>
        <td>28/02/2013</td>
        <td>33332222</td>
        <td>France</td>
        <td>RRR</td>
    </tr>
    <tr>
        <td>13/02/2013</td>
        <td>88884444</td>
        <td>Auckland</td>
        <td>AA</td>
    </tr>
    <tr>
        <td>04/02/2013</td>
        <td>11115555</td>
        <td>New York</td>
        <td>BBB</td>
    </tr>
</table>

JS

var table = $('table');

$('#dateHeader')
    .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){

                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;

        });

    });

这个js文件被引用： https://raw.github.com/padolsey/jQuery-Plugins/master/sortElements/jquery.sortElements.js

万一你要建议某种表格排序插件，请注意我的最终结果不会在点击标题时排序，排序函数将从我的javascript中的各个地方调用，我只是使用这个点击示例作为一个简单的起点，让概念有效，并作为提出这个问题的简单方法。

Answer 1

像这样修改sortElements方法：

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

            var strDate = $.text ([a]);
            var dateParts = strDate.split("/");
            var date = new Date(dateParts[2], (dateParts[1] - 1), dateParts[0]);
            var a1 = date.getTime ();
            strDate = $.text ([b]);
            dateParts = strDate.split("/");
            date = new Date(dateParts[2], (dateParts[1] - 1), dateParts[0]);
            b1 = date.getTime ();

            return a1 > b1 ?
                inverse ? -1 : 1
                : inverse ? 1 : -1;

使用基于日期值的jQuery对表进行排序

1 个答案: