TableSorter的奇怪图像加载

Question

由于我现在正在Chrome上调试我的前端，所以在滚动、排序等过程中将TableSorter插件应用于页面中的表时，会有一种奇怪的行为。它试图通过这个url加载字符串/二进制数据(至少同时加载10个)：

Request URL:data:image/gif;base64,R0lGODlhAQABAIAAAP8AAAAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==

当您试图集中精力调试到服务器的请求时，这类请求会扰乱您的工作。

任何帮助都是非常感谢的！

请注意，只有在应用TableSorter插件时才能观察到这种行为。

初始化插件的代码：

$('.tableSorter').tablesorter({
        theme : 'blue',
        // initialize zebra striping and resizable widgets on the table
        widgets: [ "zebra", "resizable", "columns", "cssStickyHeaders", "filter" ],//"saveSort" 
        resizable_widths :  RFM.width,
        usNumberFormat : false,
        widgetOptions: {
            resizable_addLastColumn : true,
          resizable : true,
          cssStickyHeaders_offset        : 50,
          cssStickyHeaders_addCaption    : true,
          cssStickyHeaders_filteredToTop : true,
          cssStickyHeaders_zIndex        : 10,
          cssStickyHeaders_attachTo : null
        },
        headers: { 
            0:{
                sorter: false 
            }
        }
    }).tablesorterPager({container: $("#pager"), output: RFM.lang.pager, savePages : false});

CSS文件：

<link rel="stylesheet" href="js/plugins/tablesorter/theme.blue.css">
<link rel="stylesheet" href="js/plugins/tablesorter/jquery.tablesorter.pager.css">

JS档案：

 <script src="js/plugins/tablesorter/jquery.tablesorter.min.js"></script>
 <script src="js/plugins/tablesorter/jquery.tablesorter.widgets.js"></script>
 <script src="js/plugins/tablesorter/jquery.tablesorter.pager.js"></script>
 <script src="js/plugins/tablesorter/widget-cssStickyHeaders.js"></script>

Answer 1

哦，我想可能是什么问题。在theme.blue.css文件中有一个定义，它将头排序箭头添加到10列中：

.tablesorter-blue .header,
.tablesorter-blue .tablesorter-header {
    /* black (unsorted) double arrow */
    background-image: url(data:image/gif;base64,R0lGODlhFQAJAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAkAAAIXjI+AywnaYnhUMoqt3gZXPmVg94yJVQAAOw==);
    /* white (unsorted) double arrow */
    /* background-image: url(data:image/gif;base64,R0lGODlhFQAJAIAAAP///////yH5BAEAAAEALAAAAAAVAAkAAAIXjI+AywnaYnhUMoqt3gZXPmVg94yJVQAAOw==); */
    /* image */
    /* background-image: url(images/black-unsorted.gif); */
    background-repeat: no-repeat;
    background-position: center right;
    padding: 4px 18px 4px 4px;
    white-space: normal;
    cursor: pointer;
}

您的调试器似乎试图实际加载base64编码的映像。

我不知道如何阻止调试器这样做，但是如果您注释这一行并取消指向实际图像url(images/black-unsorted.gif);的行的注释，这可能会解决这个问题。