0

我正在使用 JSONP 返回状态，但我还将图片和一些详细信息显示为列表中的项目。当我加载页面时，我看到加载所有图片都有延迟，除了第一个图片，这与 JSONP 调用拉状态的时间差不多。你可以在这里看到。

JSONP 是否有一些固有的东西会影响我的背景图像的加载？我认为这是一个异步调用，所以我不确定为什么浏览器会阻止调用来拉取图像。这是我正在使用的 CSS（当我遍历列表中的项目时，ID 是在运行时动态生成和提供的）：

<div class='avatar status available' style='background-image: url(https://services.xxx.com/pics/{id}.jpg);'><span></span></div>
4

2 回答 2

0

对于在后台显示图像规则，您需要图像或资源的绝对路由（URL）。在您的链接中，绝对（URL）是http://content.../d812611d-5284-4abe-bb85-4ccda1424f16/2013-04-18_1722.png

不推荐显示来自 CSS 的动态图像。

于 2013-04-19T16:33:43.600 回答
0

我发现的最佳解决方案不是使用 CSS，而是使用<img>标签。所以现在我的代码变成了：

<div class='avatar status available'><img onerror='imgError(this)' src='https://services.xxx.com/pics/{id}.jpg'/></div>

这会导致图像按预期加载而不会被阻止，如果图​​像无法发送默认图像，我将受益于检查错误：

function imgError (image) {
    image.onerror = function () {
        this.parent().addClass('user');
    }
    image.src = "/resources/img/user.png";
    return true;
}
于 2013-04-19T18:16:07.727 回答