6

我正在尝试弄清楚如何确定 svg 图像何时加载到浏览器中。我正在使用 Raphael JS 并且我尝试过：

var image = paper.image(path, 0,0,10,10);
image.node.addEventListener('load', function(){alert("test");});

和：

$('image').on('load')

一切都无济于事。我还使用了“onload”和“onsvgload”，它们都不起作用。

是否可以确定是否实际加载了 svg 图像？

我什至尝试使用 Image() 对象加载图像，然后调用 paper.image() - 但我得到了两次对图像的调用（而不是使用预加载的图像）；IE：

var preload = new Image();
preload.src = imgPath;
preload.addEventListener('load', function () {
    image.path = preload.src;
    //Now load image in raphael - except this still forces the browser to make another call for the image
});

有任何想法吗？

4

1 回答 1

3

使用onLoad事件处理程序是可行的，只需增加一行代码：

var image = paper.image(path, 0,0,10,10);
var image_node = image.node;
image_node.setAttribute('externalResourcesRequired','true');
image_node.addEventListener("load", function() {
    console.log("image is loaded!");
})

您需要将该externalResourcesRequired属性设置为 true。您可以在这里阅读更多相关信息：http: //www.w3.org/TR/SVG/struct.html#ExternalResourcesRequired

于 2013-05-28T01:16:58.837 回答