查看Jquery DataTable内的图片或图片

问题描述:

我可以知道是否可以将图片或图像放入DataTables行(http://datatables.net/),并且如何进行?

May I know if it is possible to put pictures or images into the rows of DataTables (http://datatables.net/) and how does one goes in doing it?

Daniel说的是真实的,但不一定说明如何做。还有很多方法。这些是主要的:

What Daniel says is true, but doesn't necessarily say how it's done. And there are many ways. Here are the main ones:

1)数据源(服务器或其他)提供了一个完整的图像标签作为数据集的一部分。不要忘记转义任何需要转义的字符,以获取有效的JSON

1) The data source (server or otherwise) provides a complete image tag as part of the data set. Don't forget to escape any characters that need escaping for valid JSON

2)数据源为一个或多个字段提供所需的信息。例如,一个名为image link的字段只有 Images / PictureName.png 部分。然后在fnRowCallback中,使用此数据创建一个图像标签。

2) The data source provides one or more fields with the information required. For example, a field called "image link" just has the Images/PictureName.png part. Then in fnRowCallback you use this data to create an image tag.

"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
  var imgLink = aData['imageLink']; // if your JSON is 3D
  // var imgLink = aData[4]; // where 4 is the zero-origin column for 2D

  var imgTag = '<img src="' + imgLink + '"/>';
  $('td:eq(4)', nRow).html(imgTag); // where 4 is the zero-origin visible column in the HTML

  return nRow;
}

3)与上述类似,但不是添加整个标签,更新以图像为背景的类。您可以对重复元素的图像进行此操作,而不是一次性或独特的数据片段。

3) Similar to above, but instead of adding a whole tag, you just update a class that has the image as a background. You would do this for images that are repeated elements rather than one-off or unique pieces of data.