在 html 输出中使用 rst 和 python-sphinx 对表进行排序

Question

我想让访问者能够对使用 python-sphinx 从 RST 生成的 HTML 页面中的表格中的单元格进行排序。假设我有一个这样的表：

.. list-table:: A fancy name table
   :header-rows: 1
   
   * - Family name
     - Given name
   * - Smith
     - Samuel
   * - Johnson
     - John

这可以很好地呈现并按输入顺序显示名称。现在我想生成一个 HTML 输出，并为用户提供将名称重新排序为字母顺序的可能性。有独立的示例和库来实现这一点，我想知道哪种解决方案已经在 Sphinx 中实现（如果有）。最好的方法是包含一个最小的扩展并修改所有表（或只是我希望能够排序的表）的属性以包含此功能。

您能否建议扩展以及如何做到这一点的最佳实践？我更愿意自己进行尽可能少的 CSS 和 JS 代码/文件操作。

Answer 1

受到已经提供的一些答案的启发，我创建了以下使用数据表的解决方案。我正在使用 html 主题“classic”，它已经包含 jquery（我不确定其他模板）。

添加conf.py额外的 css 和 js 文件：

html_static_path = ['_static']

html_css_files = [
    'https://cdn.datatables.net/1.10.23/css/jquery.dataTables.min.css',
]

html_js_files = [
    'https://cdn.datatables.net/1.10.23/js/jquery.dataTables.min.js',
    'main.js',
]

创建文件_static/main.js并添加以下行（我选择使用类“datatable”在表上显式启用此功能）：

$(document).ready( function () {
    $('table.datatable').DataTable();
} );

在您的第一个文档中，您现在可以创建一个精美的表格：

.. table::
   :class: datatable

   =====  =====  =======
   A      B      A and B
   =====  =====  =======
   False  False  False
   True   False  False
   False  True   False
   True   True   True
   =====  =====  =======

向表元素添加:class: datatable一个类，因此 DataTable javascript 应用于该表。