jquery - jQuery 数据表中带有超链接的图像未显示

标签 jquery datatables

我的 aspx 网站中有一个 div 容器,我在后面填充了一个 datatable:

int[] Center = { 0, 5, 7 };

        string html = "<table id='Liste' class='display' cellspacing='0' style='width:100%'><thead>";
        //add header row
        html += "<tr>";

        for (int i = 0; i <= dt.Columns.Count - 1; i++)
        {
            if (Center.Contains(i)) html += "<th align='center'>" + dt.Columns[i].ColumnName + "</th>";
            else html += "<th>" + dt.Columns[i].ColumnName + "</th>";
        }

        html += "</tr></thead><tbody>";
        //add rows
        for (int i = 0; i < dt.Rows.Count; i++)
        {
            html += "<tr>";
            for (int y = 0; y <= dt.Columns.Count - 1; y++)
            {
                if (y == 8 || y == 9) { html += "<td align='center'>" + Convert.ToDateTime(dt.Rows[i][y].ToString()).ToShortDateString() + "</td>"; }
                else
                {
                    if (y == 10)
                    {
                        html += "<td align='center'><a href='Details.aspx'><img scr='images/Calendar.png'></a></td>";
                    }
                    else
                    {
                        if (Center.Contains(y)) html += "<td align='center'>" + dt.Rows[i][y].ToString() + "</td>";
                        else html += "<td>" + dt.Rows[i][y].ToString() + "</td>";
                    }
                }
            }
            html += "</tr>";
        }
        //footer
        html += "</tbody><tfoot><tr>";
        foreach (DataColumn dc in dt.Columns) html += @"<th>" + dc.ColumnName + "</th>";
        html += "</tr></tfoot></table>";

        html += @"<script>

                    $(document).ready(function() {

                      $('#Liste').DataTable({

                                fixedHeader: {
                                                header: true,
                                                footer: true
                                            },

                                paging: false,

                                columnDefs: [{ type: 'de_date', targets: 8}, 
                                            { type: 'de_date', targets: 9}
                                             ]
                      });
                    });
                   </script>";

        DIV_Table.InnerHtml = html;

在单元格 10 中应该显示带有超链接的图像:

if (y == 10)
{
html += "<td align='center'><a href='Details.aspx'><img scr='images/Calendar.png'></a></td>";
}

表格中未显示图像。如果我标记表格,图像“容器”就会以正确的尺寸显示,并且超链接可以通过单击“容器”来工作。如果我单击“容器”的属性,其所有内容都显示为“不可用”,预计大小(这是正确的)。

enter image description here

我尝试渲染第 10 列,但这不起作用:

{ targets: 10,
  render: function(data){
   return '<img src='images/Calendar.png'>'}
}

感谢您的帮助。

最佳答案

是因为您的 img 标签中的拼写错误吗?

...><img scr='images/Calendar.png'></...

当然应该读取“src”,就像在上一个代码片段中一样。但是最后一段代码不会因为 return 字符串中的引号而出现问题吗?

关于jquery - jQuery 数据表中带有超链接的图像未显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56790799/

相关文章:

javascript - 将 element.id 设置为副作用是不好的做法吗?

javascript - 为什么 jQuery.each 无法检索到正确的高度值?

javascript - 单击链接时更改文本

javascript - 如何防止通过 Twitter Bootstrap Typeahead 过滤结果?

php - 添加自定义字段 jQuery 数据表

jquery - 滚动顶部和滚动左摇晃

jquery - 在 DataTables (jQuery) 中对 3 个表进行排序

javascript - jQuery 数据表 : data is visible after click on column name

php - 使用 json 添加一行 DataTable

jquery - 如何使用新的 JSON 数据手动更新数据表