1

我正在尝试在 iPhone/iPad 上显示 SVG。此代码在 ASP.Net 页面中运行。我正在使用 Raphael 显示图形和 Raphael 处理的所有其他爵士乐。但是,我的代码实际上并未在 iOS 上执行。

 img = new Image();

 //img.onload = function () { drawLayersWhenAllAreLoaded(); };
 if (img.addEventListener) {
     img.addEventListener('load', drawLayersWhenAllAreLoaded, false);
 }
 else {
     img.attachEvent("onload", function () { return (drawLayersWhenAllAreLoaded.call(img, window.event)); });
 }

 img.src = files[i];

我已经在 Windows 上的 Chrome、Firefox 和 Safari 中对此进行了测试,效果很好。我已经在 Mac OS X 上的 Chrome、Firefox 和 Safari 中对此进行了测试,效果很好。但是,在 iOS 上运行时(无论是 iOS 6 还是 iOS 7,无论 iPhone 还是 iPad),该drawLayersWhenAllAreLoaded功能都不会被执行。如果它没有被执行,图像就不会显示在屏幕上。

这是我测试的最终代码。我已经测试过不检查 iOS。我已经使用 just 进行了测试img.onload。我试过只使用img.addEventListener. 如果尝试了从最简单到最复杂的每个版本的代码,我根本无法让它工作。如果我在 中添加警报drawLayersWhenAllAreLoaded,它会显示在上面的所有浏览器上,但不会显示在 iOS 上。

据我了解,src在 HTML/jQuery 中设置图像将加载图像。我们的图像可能相当大,所以我需要在调用之前等待它们全部加载drawLayersWhenAllAreLoaded(此代码在加载一堆图像的循环中)。

我已经在谷歌上搜索了几个小时来寻找类似的东西,但找不到任何东西。想知道是否有人再次遇到这种情况,或者看看我做错了什么?

谢谢。

编辑

经过更多测试,我确定我的drawLayersWhenAllAreLoaded确实受到了打击,但只有一次。我目前正在尝试加载 32 张图片。加载图像的代码在 iOS 上运行了 32 次(每次添加一个警报显示),但drawLayersWhenAllAreLoaded只调用一次。

4

1 回答 1

0

所以我最终能够使该load方法执行。我将我的代码切换为使用imagesLoadedhttp://desandro.github.io/imagesloaded/),但这仍然没有解决我的问题。似乎在 Mobile Safari 中,它不会加载未添加到 DOM 的对象。一旦我将动态生成的图像添加到 adiv中,它就开始工作了。我不确定这是否是 Apple 出于记忆目的而设计的,还是只是一个问题。

以为我会发布此内容以帮助可能遇到此问题的其他人。

var $img = $('<img>').attr('src', files[i])
              .css({
                 "position":"absolute",
                 "top":"0px",
                 "left":"0px",)
             .prependTo(".canvas").imagesLoaded(function () {
                    drawLayersWhenAllAreLoaded();
});
于 2013-10-21T14:58:17.203 回答