Question

我想在iPhone / iPad上显示SVG。此代码在ASP.Net页面中运行。我正在使用拉斐尔来展示拉斐尔所处理的图形和所有其他爵士乐。但是，我的代码实际上并没有在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。我使用img.onload进行了测试。我尝试过使用img.addEventListener。如果尝试从最简单到最复杂的每个版本的代码，我根本无法让它工作。如果我在drawLayersWhenAllAreLoaded中发出提醒，它会在上面的所有浏览器中显示，但不会在iOS上显示。

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

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

感谢。

EDITED ：

经过更多测试后，我确定我的drawLayersWhenAllAreLoaded确实被击中，但只有一次。我目前正在尝试加载32张图片。加载图像的代码在iOS上运行32次（每次添加一个警报），但drawLayersWhenAllAreLoaded只调用一次。

Answer 1

所以我最终能够执行load方法。我将代码切换为使用imagesLoaded（http://desandro.github.io/imagesloaded/），但这仍然无法解决我的问题。似乎在Mobile Safari中，它不会加载未添加到DOM的对象。将动态生成的图像添加到div后，它就开始工作了。我不确定这是出于内存目的还是Apple的设计，还是仅仅是一个问题。

我以为我会发布这个帖子来帮助可能遇到这个问题的其他人。

var $img = $('<img>').attr('src', files[i])
              .css({
                 "position":"absolute",
                 "top":"0px",
                 "left":"0px",)
             .prependTo(".canvas").imagesLoaded(function () {
                    drawLayersWhenAllAreLoaded();
});

HTML / jQuery onload / load没有在iOS上执行

1 个答案: