Question

我是jQuery等的新手，但我正在构建一个包含HTML表的网站，并设法让jQuery tablesorter正常工作。然而，在其中一个专栏中，我的日期很长，如2017年6月5日。

按日期列排序时，它会按如下方式对行进行排序：

2017年7月6日

2017年6月29日

2018年5月21日

我在head部分使用的代码是：

<!-- load jQuery and tablesorter scripts -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="js/jquery.tablesorter.js"></script>
<script>
$(document).ready(function() {
    $("#myTable").tablesorter( {sortList: [[0,1]]} );
});
</script>

我的桌子看起来像这样：

<table id="myTable" class="table table-bordered table-striped tablesorter">
                    <colgroup>
                        <col class="col-lg-2">
                        <col class="col-lg-2">
                        <col class="col-lg-5">
                        <col class="col-lg-3">
                    </colgroup>
                    <thead>
                        <tr>
                            <th>Date</th>
                            <th>Location</th>
                            <th>Event</th>
                            <th>Organiser</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>29 Jun, 2017</td>
                            <td>New York</td>
                            <td>Book Club</td>
                            <td>John Smith</td>
                        </tr>
                        <tr>
                            <td>6 Jul, 2017</td>
                            <td>New York</td>
                            <td>Book Club</td>
                            <td>John Smith</td>
                        </tr>
                        <tr>
                            <td>21 May, 2018</td>
                            <td>Chicago</td>
                            <td>Book Expo</td>
                            <td>Bob Smith</td>
                        </tr>
                    </tbody>
                </table>

非常感谢任何帮助！

Answer 1

您可以在日期列的th标记中使用shortDate parser和data-date-format选项。以下是代码https://jsfiddle.net/savicmi/htLdapj8/ <th data-sorter="shortDate" data-date-format="d MMM yyyy">Date</th>的jsfiddle。

有关https://mottie.github.io/tablesorter/docs/example-option-date-format.html上的tablesorter日期格式选项的更多信息。

使用jQuery tablesorter对长日期进行排序

1 个答案: