11

我正在实现 jQuery 的表格排序器,但箭头似乎无法显示。

这是我到目前为止所做的:

<script type="text/javascript" src="/path/to/jquery-latest.js"></script> 
<script type="text/javascript" src="/path/to/jquery.tablesorter.js"></script>

$(document).ready(function() 
    { 
        $("#myTable").tablesorter(); 
    } 
); 

表格排序很好,但箭头不显示。我在这里错过了什么吗?
我什至添加了以下但没有工作:

<LINK rel="StyleSheet" type="text/css" href="../tablesorter/themes/green/style.css"> 
4

6 回答 6

12

在此页面上使用 tablesorter 时我遇到了同样的问题 - http://ajthomas.co.uk/fpl/。但是,这是因为我错过了添加下载中的样式表和图像。看起来你也是。

于 2012-08-01T16:19:40.810 回答
6

如果您级联他们的样式表,它将看起来与 TableSorter 站点上的外观完全相同。您甚至不需要将其从他们的包裹中移出。只需在样式表声明后添加这一行:

<link href="[YOUR PATH TO]/tablesorter/themes/blue/style.css" rel="stylesheet" type="text/css" />
于 2013-04-16T21:26:09.343 回答
2

为了让箭头出现,我必须做几件事。

首先是添加css。我将 tablesorter-blue.css 与我的其余样式一起移动到目录中,然后使用以下标记将其导入。

<link rel="stylesheet" href="/styles/tablesorter-blue.css">

其他答案遗漏的部分是在定义表格时指定样式。

<script>$(function() {$('#table_to_sort').tablesorter({"theme": "blue"});});</script>

当您查看 tablesorter-*.css 文件时,您会看到样式是使用诸如 tablesorter-blue 或 tablesorter-green 之类的名称定义的。通过指定主题,它将主题名称附加到“tablesorter-”,以便您可以包含所有主题,并将不同的主题应用于不同的表。

在最新版本中,实际图像以 Base64 格式在 CSS 中提供,因此不再需要将图像文件复制到您的项目中。

于 2019-12-02T00:33:43.713 回答
1

我在最新版本中遇到了这个问题。(可能与原始问题无关,因为它已经很老了)

我包含了我的主题(蓝色)的样式,并且该样式包含了 Base 64 编码的箭头图像,因此它应该可以正常工作。

简单的问题是除了tablesorter之外我没有tablesorter-blue类,所以它正在加载默认主题。

于 2019-06-24T20:29:04.330 回答
0

如果有人仍然遇到 tablesorter 不显示排序箭头的问题,这是我在初始化回调中使用的一个小技巧:

$("table.sort").tablesorter({
  theme : 'dropbox',
  cssIcon: 'tablesorter-icon',
  initialized : function(table){
    $(table).find('thead .tablesorter-header-inner').append('<i class="tablesorter-icon"></i>');
  }
});
于 2017-07-11T19:29:47.157 回答
-2

您需要将类 tablesorter添加到您的表中

于 2017-10-16T19:19:28.847 回答