列中的jqGrid图像在Firefox中不起作用答案

【问题标题】：jqGrid image in a column not working in firefox列中的jqGrid图像在Firefox中不起作用
【发布时间】：2015-08-12 11:49:54
【问题描述】：

大家早上好，

我必须在 jqGrid 列中显示一个 16x40 像素的图像，当我单击时它会改变在上面;为此，我将我的格式化程序定义如下：

function dataViewLink(cellValue, options, rowdata, action)
{   
    var chartLink = "<div style='float:left;'><img id='_addtochart" + options.rowId + "' class='ui-icon-addtochart' onclick='devToggleChartChecked("  + options.rowId + ")'></img></div>";
    return chartLink; 
}

并创建了两个具有不同图像的 CSS 类：

.ui-icon-addtochart
{
    content: url(../images/addtochart.jpg) !important;
}

.ui-icon-removefromchart
{
    content: url(../images/removefromchart.jpg) !important;
}

然后，我使用 jquery 动态切换这些类。一切在 chrome 上工作正常，但没有办法让它在 firefox 上工作。图片在 Firefox 上不显示。

我已经在 Firefox 上发现了一个与 'content' 属性相关的问题：

Content url does not display image on firefox browser

并尝试了所有建议的解决方法，但没有一个对我有用。

我无法用 Firefox 显示这些图像。

这个小问题快把我逼疯了。有人有什么建议吗？

非常感谢您。

布鲁诺

【问题讨论】：

标签： css image firefox jqgrid

【解决方案1】：

看来我找到了解决办法；我将格式化程序更改为：

function dataViewLink2(cellValue, options, rowdata, action)
{   
    var chartLink = "<div style='float:left;' id='_addtochart" + options.rowId + "' class='ui-icon-addtochart ui_add_dev' onclick='devToggleChartChecked("  + options.rowId + ")'></div>";
    return chartLink; 
}

和 CSS 类：

.ui-icon-addtochart
{
    background: url(../images/addtochart.jpg);
    height: 16px;
    width: 144px;
}

.ui-icon-removefromchart
{
    background: url(../images/removefromchart.jpg);
    height: 16px;
    width: 215px;
}

它适用于 chrome 和 firefox。

还是非常感谢你！

布鲁诺

【讨论】：