Firefox中的表格順序混亂，但在其他瀏覽器中作業正常

我有一張按日期排序的表格，它在 EDGE 和 Chrome 中運行良好，但在 Firefox 中順序混亂。應該在頂部的一系列行被移動到底部。
HTML：

<div class="row mt-4">
    <div class="col-12">
        <div class="card">
            <h6 class="card-header">Change Log Items</h6>
            <div class="card-body">
                <table id="changes" class="table table-striped table-hover table-bordered table-sm">
                    <thead class="table-dark">
                        <tr class="sticky">
                            <th>Title</th>
                            <th>Component</th>
                            <th>Date Committed</th>
                            <th>Jira Link</th>
                            <th>Details</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for log in logs %}
                        <tr>
                            <td>{{log.title}}</td>
                            <td>{{log.component}}</td>
                            <td>{{log.date_added}}</td>
                            <td>{% if log.jira_number %}<a class="general" href="https://jira.kinaxis.com/browse/{{log.jira_number}}" target="_blank">{{log.jira_number}}{% endif %}</a></td>
                            <td>{% if log.details %}{{log.details}}{% elif not log.details and log.jira_number %}See Jira ticket{% endif %}</td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

看法：

@login_required
def change_log(request):
    logs = ChangeLog.objects.all().order_by('date_added')
    return render(request, 'help\changelog.html', {'logs': logs})

任何資訊都有幫助！:)

更新：我意識到問題是由與 HTML 元素對應的 jQuery 引起的：

<script type="text/javascript">
$(document).ready(function () {
    const exceptions = $('#changes').DataTable({
        "order": [[ 2, "desc" ]],
        "pageLength": 50,
        "columnDefs": [{"type": "date", "targets": [2],}], // Sort by Date properly
    });
});
</script>

似乎 DataTable 與 FF 有一些問題？將 "order": [[ 2, "desc" ]]" 中的順序更改為 asc 不適用于 FF。

uj5u.com熱心網友回復：

最有可能的是，Firefox 不支持您使用的日期格式，因為“每個瀏覽器支持的日期格式差異很大”。在這種情況下，可以按照此處的建議使用 DataTables 的“最終”日期/時間排序插件。為此，請在您的 HTML 檔案中包含以下庫，如上述鏈接中所述：

<script type="text/javascript" charset="utf8" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/plug-ins/1.11.5/sorting/datetime-moment.js"></script>

接下來，注冊您希望 DataTables 使用該$.fn.dataTable.moment(format)方法檢測和排序的日期格式。例如：

$(document).ready(function() {
    $.fn.dataTable.moment( 'HH:mm MMM D, YY' );
    ...

DataTables 將通過檢查列中的資料是否與任何給定型別匹配來自動檢測包含日期資料的列。如果 DataTable 包含多個日期列，則可以注冊多種日期格式。

uj5u.com熱心網友回復：

嘗試將“ordering: true”顯式添加到您的 DataTable() 實體中，如下所示：

<script type="text/javascript">
$(document).ready(function () {
    const exceptions = $('#changes').DataTable({
        ordering: true, # add this line
        "order": [[ 2, "desc" ]],
        "pageLength": 50,
        "columnDefs": [{"type": "date", "targets": [2],}], // Sort by Date properly
    });
});
</script>

更多的是建議而不是答案，但不想將此代碼粘貼到評論中。

標籤：Python html django 火狐 django-模板

上一篇：在choco升級時保持不同的安裝目錄

下一篇：攔截來自側邊欄面板的請求