DataTables

Question

我在我的网站上使用插件 "DataTables"，我想在 table 的 TH 中放一张图片，但是当我使用响应模式时这张图片消失了！

这是一个例子： http://live.datatables.net/qikocosi/1/edit

有人能帮帮我吗？

Answer 1

我还没有找到官方支持的方法，但您可以试试这个解决方法：

似乎切换到响应模式会从 header 个单元格（包括您的 img 标签）中删除 html，因此您可能需要使用一些 CSS做到这一点：

li[data-dtr-index="1"] span.dtr-title{
  background-repeat: no-repeat;
  background-image: url("http://i.imgur.com/iKWdGjP.png?1");
  color: transparent;
}

由于这个 js 库自动添加 : 字符，我使用 color: transparent; 来隐藏它。因此，如果您想在图片旁边添加一些文字，请删除 CSS 的这一部分。

此外，由于空 span 不会显示任何 background-image，我已将   添加到您的 html:

<th class="tablet">&nbsp;<img src="http://i.imgur.com/iKWdGjP.png?1"></th>

例子在这里： http://live.datatables.net/nijejoye/1/edit

Answer 2

我找到答案了：

您必须修改 dataTables.responsive.js

上的简单一行

变化：

var title = header.text();

对于：

var title = header.html();

感谢 AAB 和 Ivan Jocovic 的帮助！

DataTables - 图像在 THin 响应模式下消失

DataTables - Image dissappears in TH in responsive mode

jquery

responsive-design