IE 中奇怪的图像对象行为。我的解决方案是最好的吗？答案

【问题标题】：Strange image object behaviour in IE. Is my solution the best one?IE 中奇怪的图像对象行为。我的解决方案是最好的吗？
【发布时间】：2012-11-17 00:45:03
【问题描述】：

我有一个函数接收要么预加载的JS图像对象或图像url。这是作为photo 变量传入的。

我执行检查以查看“照片”变量是否为字符串。如果是，我创建一个新的图像对象并使用 onload 事件触发传入新创建的图像对象的 generateSlide() 函数，如下所示：

renderSlide: function (slideindex, photo, external, count, text) {
        var self = this;
        var image = new Image();
        if (typeof (photo) == 'string') {
            image.onload = function () {
                self.generateSlide(slideindex, image, external, count, text);
            };
            image.src = photo;
        } else {
            image.src = photo.src;
            self.generateSlide(slideindex, image, external, count, text);
        }
 },

如果“照片”变量是预加载的 JS 图像对象，我只需运行函数本身，将图像对象传递给 generateSlide();

一切都很好，但是由于某种原因在 IE 9 中我不能简单地将“照片”变量直接传递到 generateSlide() 函数中。我必须创建一个新的图像对象并设置 src 以匹配照片对象的 src 属性。

这对我来说毫无意义，我不明白为什么会这样？

在 photo var 是实际 JS 图像对象的情况下，它被确认为在其他地方加载。（我正在预加载资产）；

总而言之，上面的代码运行良好，但谁能解释一下为什么我必须创建一个新的图像对象而不能简单地传入原始图像对象？有没有更优雅的解决方案？到目前为止，我还没有注意到上述方法有任何问题，但有没有人知道使用这种方法的任何陷阱。

提前致谢

【问题讨论】：

听起来可能是范围问题，你有完整的源代码吗？您是否尝试将照片分配给图像然后传递图像？
是的，我有完整的源代码，但这是一个如此大的项目的一部分，说实话很难发布。我会按照你的建议试试。谢谢加雷斯。
恐怕这行不通。范围问题不会影响所有浏览器？？？
我也会这么认为。我想不出还有什么会导致这种情况的。 IE 9 给出了什么错误？
这样的事情有帮助吗？ (function(photo){ self.generateSlide(slideindex, photo, external, count, text); })(photo);

标签： javascript

【解决方案1】：

这听起来像是范围的问题。您是否尝试过关闭调用以确保捕捉到正确的照片？

renderSlide: function (slideindex, photo, external, count, text) {
        var self = this;

        if (typeof (photo) == 'string') {
           var image = new Image();
            image.onload = function () {
                self.generateSlide(slideindex, image, external, count, text);
            };
            image.src = photo;
        } else {
          (function(photo){
            self.generateSlide(slideindex, photo, external, count, text);
          })(photo);
        }

【讨论】：