另一个IE8图片加载问题

Question

I've searched through different sites and can't quite figure out where I've gone wrong. 我搜索了不同的站点，但无法完全弄清楚我哪里出错了。 This works in the major browsers, but not in IE7 or IE8. 这在主要浏览器中有效，但不适用于IE7或IE8。 My issue is that the source of the event is null once the image is loaded. 我的问题是，一旦加载图片，事件的源便为null。 You'll see that printed out on the page (I have a div where I'm sending some text). 您会在页面上看到打印出来的内容（我有一个div，我正在其中发送一些文本）。 Here is my code: 这是我的代码：

<!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 (old versions) didn't pass an event object as a parameter. Internet Explorer（旧版本）未将事件对象作为参数传递。 It's stored instead in a global (window) property called "event". 而是将其存储在称为“事件”的全局（窗口）属性中。

The traditional approach was to do something like this at the top of the event handler: 传统方法是在事件处理程序的顶部执行以下操作：

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

另一个IE8图片加载问题

问题描述

1 个解决方案

解决方案1
0 2013-09-11 14:12:25

另一个IE8图片加载问题

问题描述

1 个解决方案

解决方案1 0 2013-09-11 14:12:25

解决方案1
0 2013-09-11 14:12:25