this.style.backgroundColor не работает в IE7 / 8 - PullRequest
Новая
       69

this.style.backgroundColor не работает в IE7 / 8

0 голосов
/ 20 февраля 2012

мой код: 

<!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>

он хорошо работает в Chrome 、 FireFox и ie9, но не может работать в IE7 / 8

сообщение об ошибке: Невозможно установитьзначение свойства "backgroundColor": объект является нулевым или неопределенным

что со мной?

Ответы [ 2 ]

1 голос
/ 20 февраля 2012

При использовании attachEvent в IE this устанавливается для объекта window, а не для объекта, на котором произошло событие.

В IE глобальная переменная window.event.srcElement будет содержатьцелевой объект для события.

Вы можете закодировать обходной путь, как этот, чтобы заставить все обработчики событий работать одинаково: 

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устанавливается в качестве исходного объекта события, а аргумент обработчика события является объектом события.

0 голосов
/ 20 февраля 2012

this не привязан к элементу источника в IE attachEvent.

Вместо этого используйте event.srcElement.

Также обратите внимание, что свойство глобального объекта event и его свойство srcElement также относятся к IE.

...