Question

我在行中有特定的列，我想在文本的左侧添加图像。这个人（jQuery DataTables add country icons each column）有完全相同的问题。他想在单元格的文本左侧添加标记图标;我想基本上做同样的事情（但没有标志图标）。如果每个列都有一个图像，我只会在表格中创建另一行，但是有些列不应该有图标，所以在这种情况下它不是真正的选项。

到目前为止，在我的数据表选项中，我正在执行以下操作：

  options = {
    "createdRow": function(row, data, index){
      var sharedArray = scope.$eval(attrs.sharedData);
      var rowValue = data[1] + "_" + data[0];
      if ($.inArray(rowValue, sharedArray) != -1){
        $('td', row).eq(0).addClass('shared');
      }
    }

此时我最初想用css为.shared元素添加背景图片，但我遇到了两个问题，其中最重要的是如果背景图像是什么的话，就不可能在悬停时添加事件设置图标。

然后我尝试在行

之前创建一个跨度

$(row).prepend('<span class="shared-icon"></span>');

希望然后在跨度中添加背景图像和悬停事件，但在TR中添加它会导致行和它们各自的标题出现巨大的间距问题。

我认为我错过了一些相对简单的东西，但现在已经停留了几个小时，现在正在使用不同的数据库功能。想法？

Answer 1

如何使用fnCreatedCell选项

实施例

"fnCreatedCell": function (nTd, sData, oData, iRow, iCol){
  var sharedArray = scope.$eval(attrs.sharedData);
  var rowValue = oData[1] + "_" + oData[0];
  if ($.inArray(rowValue, sharedArray) != -1){
    $(nTd).addClass('shared');
  }
}

其中nTd是单元格，sData是单元格数据，oData是行数据，iRow是行索引，iCol是列索引。

Answer 2

我不知道为什么我的思想以前没有工作过;我今天就解决了这个问题，并在十分钟之内完成了这项工作。

    "createdRow": function(row, data, index){
      var sharedArray = scope.$eval(attrs.sharedData);
      var rowValue = data[1] + "_" + data[0];
      if ($.inArray(rowValue, sharedArray) != -1){
        var data = $('td', row).eq(0).html();
        $('td', row).eq(0).html("<span class='glyphicon glyphicon-asterisk'></span>" + data);
      + data }

数据表;添加图标以选择行

2 个答案: