我有一个表排序器表,下面的CSS中应用了sort up和sort down图标

.tablesorter-headerSortDown {
    background-image: url("../images/sort_down.png");
    background-size: 16px 16px;
}
.tablesorter-headerSortUp   {
    background-image: url("../images/sort_up.png");
    background-size: 16px 16px;
}

我尝试过类似的CSS来应用未排序的图像(左箭头而不是上下箭头)
我还尝试过.tablesorter-icon的css,它覆盖了向上和向下箭头,并且始终存在。
有这个的CSS类吗?我应该处理这个初始化吗?
谢谢你的阅读,
表排序程序初始化
$(function() {
  $(".tablesorter")
    .tablesorter({
      widthFixed: false,
      sortList: [
            [0,0],
            [1,0]
        ],
        showProcessing: true,


      // this is the default setting
      cssChildRow: "tablesorter-childRow",

      // initialize zebra and filter widgets
      widgets: ["zebra", "filter", "stickyHeaders"],

      headers: { 0: { filter: true, sorter: true },
                 1: { filter: true, sorter: true },
                 2: { filter: false, sorter: true },
                 3: { filter: false, sorter: true },
                 4: { filter: false, sorter: false },
                 5: { filter: false, sorter: false },
                 6: { filter: false, sorter: false },
                 7: { filter: false, sorter: false },
                 8: { filter: false, sorter: false }},

      widgetOptions: {
        stickyHeaders_attachTo: '#connectionGrid',
        stickyHeaders_offset: 0,
        stickyHeaders_yScroll : '#tablesorter',
        stickyHeaders_addCaption: true,
        // include child row content while filtering, if true
        filter_childRows  : true,
        // class name applied to filter row and each input
        filter_cssFilter  : 'tablesorter-filter',
        filter_reset : '.clearall',
        // search from beginning
        filter_startsWith : false,
        // Set this option to false to make the searches case sensitive
        filter_ignoreCase : true,
        filter_functions : { 0 : true, 2 : true },
        sortInitialOrder: "desc",
        zebra : ["odd-row", "even-row" ]
      }

    });

编辑:这就是它现在的样子,我想为所有未排序的列添加一个箭头。
javascript - TableSorter-将图标应用于未排序的列-LMLPHP

最佳答案

问题是,您对原始tablesorter(v2.0.5)使用的是css,而您正在使用的过滤器小部件将只对myfork of tablesorter(当前为v2.25.0)起作用。
原始表排序器使用"tablesorter-headerSortUp"这实际上是用于降序排序的名称(出于某种原因,它是向后的)。而fork使用"tablesorter-headerAsc",由cssAsc option设置。还有一个cssDesc(设置为"tablesorter-headerDesc")选项。
不管怎样,说到重点。。。
fork有一个内置的"tablesorter-noSort"类(由应用于头单元格的cssNoSort option设置)。
如果在headerTemplate option中包含图标,则可以将cssIconNone option设置为针对该图标。

关于javascript - TableSorter-将图标应用于未排序的列,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/34359952/

10-12 13:19