jQuery TableSorter-不显示排序箭头

用户名

我知道以前已经回答了几次，但是没有一种解决方案对我有用。我花了几天的时间试图使箭头显示出来，但没有成功。我想显示排序箭头，并在对其进行排序时突出显示该列。我的html代码如下：

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="theme/style.css" media="print, projection, screen" />
        <script type="text/javascript" src="jquery-2.1.1.min.js"></script> 
        <script type="text/javascript" src="tablesorter/js/jquery.tablesorter.js">    </script>
        <script type="text/javascript" id="js" >
            $(document).ready(function()
                    // call the tablesorter plugin 
                { 
                    $("#myTable").tablesorter({ 
                        // sort on the first column and third column, order asc 
                        sortList: [[0,0],[2,0]] 
                    });  
                }); 

        </script>

    </head>
    <body>
        <table id="myTable" class="tablesorter"> 
            <thead > 
            <tr> 
                <th>Last Name</th> 
                <th>First Name</th> 
                <th>Email</th> 
                <th>Due</th> 
                <th>Web Site</th> 
            </tr> 
            </thead> 
            <tbody> ...

我链接到的CSS是来自以下网站的CSS：

/* tables */
table.tablesorter {
font-family:arial;
background-color: #CDCDCD;
margin:10px 0pt 15px;
font-size: 12pt;
width: 100%;
text-align: left;
}
table.tablesorter thead tr th, table.tablesorter tfoot tr th {
background-color: #e6EEEE;
border: 1px solid #FFF;
font-size: 12pt;
padding: 4px;
}
table.tablesorter th.header {
background-image: url(bg.gif);
background-repeat: no-repeat;
background-position: center right;
cursor: pointer;
}
table.tablesorter tbody td {
color: #3D3D3D;
padding: 4px;
background-color: #FFF;
vertical-align: top;
}
table.tablesorter tbody tr.odd td {
background-color:#F0F0F6;
}
table.tablesorter th.headerSortUp {
background-image: url(asc.gif);
}
table.tablesorter th.headerSortDown {
background-image: url(desc.gif);
}
table.tablesorter th.headerSortDown, table.tablesorter th.headerSortUp {
background-color: #8dbdd8;
}

CSS中引用的所有gif都和它在同一个文件夹中。我删除了.header显示的图像后发现，但是单击以对其进行排序时不会改变。这对于完成一个项目非常重要，因此，您所能提供的任何帮助将不胜感激！

防风罩

我只是认为您的CSS类是不正确的，至少那些不是tablesorter生成的。

http://jsfiddle.net/thmd6/

table.tablesorter th.tablesorter-headerUnSorted {
    background-image: url('http://tablesorter.com/themes/blue/bg.gif');
    background-repeat: no-repeat;
    background-position: center right;
    cursor: pointer;
}

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。