最近学习了一种在数据表中使用数据属性的新方法。
以前，我会以这种方式对列进行编码(请注意 font-awesome 标签):
"columns": [{
"data": "",
"fnCreatedCell": function (nTd, sData, oData, iRow, iCol)
{
$(nTd).html("<a href='#' title='Edit Account' class='modAccount'
data-voyid='"+oData.VOYID+"' data-servicename='"+oData.SERVICE_NAME+"'
data-vesselname='"+oData.VESSEL_NAME+"' data-voyage='"+oData.VOYAGE+"'
data-bound='"+oData.BOUND+"' data-cargoweek='"+oData.CARGO_WEEK+"'
data-cargoyear='"+oData.CARGO_YEAR+"' data-allocation='"+oData.ALLOCATION+"'
data-importvoyage='"+oData.IMPORT_VOYAGE+"' data-adddate='"+oData.ADD_DATE+"'
data-adduser='"+oData.ADD_USER+"' data-moddate='"+oData.MOD_DATE+"'
data-moduser='"+oData.MOD_USER+"'><i class='fa fa-edit fa-fw'> </i></a>");
},
我刚刚学习的方法遵循这样的格式:
"columns": [{
"data": "",
"fnCreatedCell": function (nTd, sData, oData, iRow, iCol)
{
$('<a />', {
'href': '#',
'title': 'Edit Account',
'class': 'modAccount',
'data-voyid': oData.VOYID,
'data-servicename': oData.SERVICE_NAME,
'data-vesselname': oData.VESSEL_NAME,
'data-voyage': oData.VOYAGE,
'data-bound': oData.BOUND,
'data-cargoweek': oData.CARGO_WEEK,
'data-cargoyear': oData.CARGO_YEAR,
'data-allocation': oData.ALLOCATION,
'data-importvoyage': oData.IMPORT_VOYAGE,
'data-adddate': oData.ADD_DATE,
'data-adduser': oData.ADD_USER,
'data-moddate': oData.MOD_DATE,
'data-moduser': oData.MOD_USER,
'text': '<i class="fa fa-edit fa-fw"> </i>' <-- does not work
}).appendTo(nTd);
}
},
我在第一段代码中引入字体超棒的图标没有问题。
第二段代码是我现在需要图标的地方。
如果您注意到第二段代码中的“文本”部分，我试图在其中引入 Font Awesome 图标。但在屏幕上，我只看到代码，看不到图标。
我怎样才能解决这个问题以包含 Font Awesome 图标？
谢谢。
最佳答案
您正在添加 HTML，因此您将字符串提供给 html 属性，而不是对象初始化程序中的 text:
'html': '<i class="fa fa-edit fa-fw"> </i>'
关于javascript - 在 fnCreatedCell 中使用 font-awesome，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54812815/