Question

我搜索了不同的网站，无法弄清楚我哪里出错了。这适用于主流浏览器，但不适用于IE7或IE8。我的问题是，一旦加载图像，事件的源是null。你会看到在页面上打印出来的（我有一个div，我正在发送一些文字）。这是我的代码：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script type="text/javascript">
    var panorama = new Object();
    var mainContainer;
    var panoHolder;
    var panoCanvas;
    //once document is loaded starts website
    AttachEvent(window, 'load', eventWindowLoaded);

    // logic to attach the event correctly in IE
    function AttachEvent(element, type, handler) {
        if (element.addEventListener) {
            element.addEventListener(type, handler, false);
        }else if (element.attachEvent) {
            element.attachEvent('on' + type, handler)
        } else {
            element['on' + type] = handler;
        }
    }

    function eventWindowLoaded() {
        panorama.totalpanels = 6;
        panorama.sourceLocation = "my_files/images/";
        panorama.width = 3200;
        panorama.height = 964;
        panorama.thumbnails = new Object();
        panorama.thumbnails.images = new Array(panorama.totalpanels);
        panorama.thumbnails.imageWidths = new Array();
        panorama.thumbnails.imageHeight = 0;

        //sets attributes of container objects
        mainContainer = document.createElement("div");
        mainContainer.id = "container";
        mainContainer.style.width = "1010px";
        mainContainer.style.height = panorama.height + "px";

        obj("mainelement").appendChild(mainContainer);

        panoHolder = document.createElement("div");
        panoHolder.id = "animationholder";
        panoHolder.style.width = panorama.width + "px";
        panoHolder.style.height = panorama.height + "px";
        panoHolder.style.left = '0px';
        panoHolder.style.top = "0px";
        mainContainer.appendChild(panoHolder);

        panoCanvas = document.createElement("div");
        panoCanvas.id = "room";
        panoCanvas.width = panorama.width;
        panoCanvas.height = panorama.height;
        panoHolder.appendChild(panoCanvas);

        for(var i = 1; i <= panorama.totalpanels; i++) {
            panorama.thumbnails.images[i - 1] = new Image();
            AttachEvent(panorama.thumbnails.images[i - 1], 'load'preloadThumbnails);
            panorama.thumbnails.images[i - 1].src = panorama.sourceLocation + "TC_tile_thumb" + i + ".jpg";
            panorama.thumbnails.images[i - 1].id = i - 1;
        }
    }

    function preloadThumbnails(e) {
        panorama.thumbnails.loaded++;
        //adds width and height attributes to panorama.thumbnails.imageWidths array
        try {
            panorama.thumbnails.imageWidths.push(e.currentTarget ? e.currentTarget.width : window.event.srcElement.width);
            panorama.thumbnails.imageHeight = e.currentTarget.height;
            panoCanvas.appendChild(e.currentTarget);
        }
        catch (ee) {
            var targ;
            if (!e) var e = window.event;
            if (e.currentTarget) targ = e.currentTarget;
            else if (e.srcElement) targ = e.srcElement;
            t('<br /> error: ' + ee + '<br /> event: ' + e + '<br /> target: ' + targ + '<br />' + e[0], true);
        }

        if (panorama.thumbnails.loaded >= panorama.totalpanels) {
            e.currentTarget.removeEventListener('load', preloadThumbnails , false);
            startFullRezPreload();
        }   
    }
    //returns an object reference
    function obj(element) {
        return document.getElementById(element);
    }

    function t(message, addTo) {
        if (addTo) {
            obj("test").innerHTML += message;
        }
        else {
            obj("test").innerHTML = message;
        }
    }
</script>
</head>

<body id="mainelement">
<div id="test">Test</div>
</body>
</html>

Answer 1

Internet Explorer（旧版本）未将事件对象作为参数传递。它存储在名为“event”的全局（窗口）属性中。

传统方法是在事件处理程序的顶部执行类似的操作：

    function preloadThumbnails(e) {
      e = e || window.event;

另一个IE8图像加载问题

1 个答案: