Question

不是第一次，我对IE8有一点css问题。我有一个可排序的表，工作正常。它有一个方向图标，显示为sorted-by标题列的背景，并根据列是按升序还是按升序排序而更改。问题是，仅在IE中，图标不会更新，直到鼠标光标离开标题。

因此，当指针悬停在列标题上时，它将保持原始图标，然后当它移开时，显示正确的图标。

没有与标题相关联的“悬停”事件，但它有css。

css看起来像这样：

.costtable th {
    cursor: pointer;
}
th[order='ascending'] {
    background-image: url(../images/down.png);
    background-position: right;
    background-repeat: no-repeat;
}
th[order='descending'] {
    background-image: url(../images/up.png);
    background-position: right;
    background-repeat: no-repeat;
}

设置图标的脚本部分如下所示：

$table.find('thead th').removeAttr('order');
$table.find('thead th:nth-child(' + columnNumber + ')').attr('order',ascOrDesc);

在有人指出之前，我知道IE8中没有nth-child css支持，但它在jQuery中有效。

Answer 1

通过使用类而不是自定义属性来修复它！

虽然它在其他浏览器中运行良好，但似乎很奇怪。

浏览器特定的表列排序图标

1 个答案: