使用javascript更改backgroundColor

Question

該腳本在IE以外的所有其他瀏覽器中均能正常運行：

nav.addEventListener('mouseover',function(e) {
        switch(e.target.id) {
            case 'aGallery':
            navOpacity.style.backgroundColor = "red";
            break;
            case 'aContact':
            navOpacity.style.backgroundColor = "green";
            break;
            case 'aAbout':
            navOpacity.style.backgroundColor = "yellow";
            break;
            case 'aHome':
            navOpacity.style.backgroundColor = "#CC33CC";
            break;
        }
    },false);

在IE中，backgroundcolor不會在懸停時更改。

有任何想法嗎？

Answer 1

在IE中，您必須使用attachEvent而不是標准的addEventListener 。 並使用srcElement代替IE的target 。

嘗試這個。

function mouseOverHandler(e) {
        switch((e.target || e.srcElement).id) {
            case 'aGallery':
            navOpacity.style.backgroundColor = "red";
            break;
            case 'aContact':
            navOpacity.style.backgroundColor = "green";
            break;
            case 'aAbout':
            navOpacity.style.backgroundColor = "yellow";
            break;
            case 'aHome':
            navOpacity.style.backgroundColor = "#CC33CC";
            break;
        }
}

if (el.addEventListener){
  el.addEventListener('mouseover', mouseOverHandler, false); 
} 
else if (el.attachEvent){
  el.attachEvent('onmouseover', mouseOverHandler);
}

Answer 2

IE使用on事件版本， onclick行， onmouseover 。 應該是你的問題。

另外，IE（版本9之前的版本）不支持addEventListener 。 您必須使用attachEvent 。

將此代碼視為起點：

if (el.addEventListener){
  el.addEventListener('click', myFunc);
} else if (el.attachEvent){
  el.attachEvent('onclick', myFunc);
}