this.style。backgroundColor在IE7/8中不起作用。

my code is:

我的代码是:

<!DOCTYPE html>
<html>
<head>
    <title>Demo</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <style type="text/css">
        p{
            border:1px solid #CCC;
            margin:5px;
            padding:5px;
        }
    </style>
    <script type="text/javascript">
        window.onload = changeColor;
        function changeColor() {
            for(var i =0; i < document.getElementById("main").getElementsByTagName("p").length; i++) {
                var obj = document.getElementById("main").getElementsByTagName("p")[i];
                if (window.addEventListener) {
                    obj.addEventListener('mousemove', function () {
                        this.style.backgroundColor ="#EEE";
                    }, false);
                    obj.addEventListener('mouseout', function () {
                        this.style.backgroundColor ="#FFF";
                    }, false);
                } else if (window.attachEvent) {
                    //for ie
                    obj.attachEvent('onmousemove', function () {
                        this.style.backgroundColor ="#EEE";
                    });
                    obj.attachEvent('onmouseout', function () {
                        this.style.backgroundColor ="#FFF";
                    });
                }
            }
        }
    </script>
</head>
<body>
    <div>
        <p>1</p>
        <div id="main">
            <p>2.1</p>
            <p>2.2</p>
            <p>2.3</p>
        </div>
    </div>
</body>
</html>

it work well in Chrome、FireFox and ie9,but can't work in IE7/8

它在Chrome、FireFox和ie9中运行良好，但在IE7/8中却无法工作。

the error message is:Unable to set the property value of the "backgroundColor": the object is null or undefined

错误消息是:无法设置“backgroundColor”的属性值:对象为空或未定义。

what's rong with me?

什么是荣和我在一起吗?

2 个解决方案

#1

When using attachEvent in IE, this is set to the window object, not to the object that the event happened on.

当在IE中使用attachEvent时，它被设置为窗口对象，而不是事件发生的对象。

In IE, the global variable window.event.srcElement will contain the target object for the event.

在IE中，全局变量window.event。srcElement将包含事件的目标对象。

You could code a work-around like this to make all the event handlers work the same:

您可以编写这样的工作，使所有事件处理程序都工作相同:

function hookEvent(event, obj, fn) {
    if (obj.addEventListener) {
        obj.addEventListener(event, fn, false);
    } else {
        obj.attachEvent("on" + event, function() {return(fn.call(obj, window.event));});
    }
}

This will make it so that this is set to the source object of the event and that the argument to the event handler is the event object.

这将使它被设置为事件的源对象，并且事件处理程序的参数是事件对象。

#2

this is not bound to the source element in IE's attachEvent.

这与IE的attachEvent中的源元素不绑定。

Use event.srcElement instead.

使用事件。srcElement代替。

Also note that the event global object property and its srcElement property are IE-specific as well.

还要注意，事件全局对象属性和它的srcElement属性也是特定于ie的。

#1