HTML/引导表排序和排序方向指示器

Question

>我正在使用引导程序来显示和排序表格。我想知道如何/是否可以在表中的每个标题中实现一个临时箭头(或其他东西(来指示它的排序方向。

Answer 1

是的，这是可能的。对于标头，请添加以下内容...

<table>
<thead>
<tr>
<th>Column 1 <span class="glyphicon glyphicon-sort"></th>
...
</tr>
</thead>
</table>

Answer 2

编辑：我假设你实际上也希望图标对表格进行排序。

这是动态行为，所以你不能在纯 HTML/CSS 中做到这一点：你需要使用 JavaScript。 以下是实现此目的的一般步骤：

1. 将所有表行存储在 JavaScript 变量中
2. 在<th>中放置另一个元素，如包含箭头图像的<span>或<img>。
3. 将单击处理程序附加到箭头，用于对表行数组进行排序
4. 对数组进行排序后，使用 DOM API 函数删除旧表，创建新表，然后在其位置插入新表。 Bootstrap 通常与 jQuery 一起使用，因此您可以查看一些 jQuery 函数来删除表，构建一个新表(通过浏览行(，然后将构建的表呈现到页面中，代替旧表。

有各种各样的库可以做到这一点，但你可以通过自己做来更简单地完成它。