css - 列中的 jqGrid 图像在 Firefox 中不起作用

Question

大家早上好

我必须在 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 url does not display image on firefox browser

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

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

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

非常感谢您。

布鲁诺

Answer 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。

非常感谢你!

布鲁诺