변경 DIV 색상 동적으로 마우스 오버

Question

에 나는 녹색 onMouseover와 이벤트에 사업부의 배경 색상을 변경하려면하지만 난이 오류 형식 오류가 계속 이유를 모르겠어요 : 정의되지 않은

의 특성 '스타일'을 읽을 수 없습니다 여기 내 JS 코드 :

// 자바 스크립트 문서

s1= new String() 
var myArray = new Array(); 
var div_id=0; 

myArray[0] = "Donald Duck"; 
myArray[1] = "Winnie Pooh"; 
myArray[2] = "Komal Waseem"; 
myArray[3] = "Hockey"; 
myArray[4] = "Basketball"; 
myArray[5] = "Shooting"; 
myArray[6] = "Mickey Mouse"; 


function test(){ 
s1 = document.getElementById('filter').value; 
var myRegex = new RegExp((s1),"ig"); 
arraysearch(myRegex); 
} 



function arraysearch(myRegex){ 
var flag=0; 

for(b=1; b<=div_id; b++) 
    { 
    var d = document.getElementById('lc'); 
    var olddiv= document.getElementById("div" + b); 
    if(olddiv){ 
    d.removeChild(olddiv);} 
    } 

for(i=0; i<myArray.length; i++) 
{ 
if (myArray[i].match(myRegex)){ 
     div_id++; 
     flag=1; 
     document.getElementById('lc').style.visibility='visible'; 
     var element = document.createElement("div"); 
     element.setAttribute('id', "div" + div_id); 
     element.appendChild(document.createTextNode(myArray[i])); 
     document.getElementById('lc').appendChild(element); 

     var x =document.getElementsByTagName("div") 
     for(t=0; t<x.length; t++) 
     { 
     //alert(t); 
     if(x[t]){ 
     x[t].onmouseover = function(){ 
     x[t].style.backgroundColor='green'; 
     } 
     } 
} 
} 
    if (flag ==0){ 
    document.getElementById('lc').style.visibility='hidden'; } 
} 

    } 

Answer 1

당신은 어느 자바 스크립트를 바꿀 수는,이 작동합니다 :

x[t].onmouseover = function() { 
    this.style.backgroundColor='green'; 
} 

원본 자바 스크립트가 작동하지 않는 이유는 마우스 오버 할 때 t이 변경 되었기 때문에 이벤트 핸들러 내에서 x[t]이 작동하지 않을 수 있기 때문입니다.

아니면 사용할 수있는 CSS :

div.myDiv:hover { 
    background-color: green; 
} 

Answer 2

경우, 당신은 div이 원하는 경우 녹색 onhover, 예컨대 : DIV의 ID가 당신이 단순히 CSS에서 같은 것을 할 수 mydiv입니다.

#mydiv{ 
    background-color:red; 
} 

#mydiv:hover{ 
    background-color:green; 
}