tr onmouse events

Question

행에 마우스를 올려 놓고 모두 강조 표시하고 싶지만 일부 셀에 다른 배경이 있으므로 아래 코드에 문제가 있습니다. 잘 모든 모든 셀입니다

<tr style="" onmouseover="this.style.background='Red';" onmouseout="this.style.background='#595959'" > 

같은 배경을 가지고 있지만 내가 셀을 클릭하면 그것을 강조하고 onmouseout="this.style.background='#595959'"는 항상 재설정됩니다.

onmouseout="this.style.background='currentCellBGColor" 

Answer 1

그것은 순수 CSS의 솔루션을 수행 할 수 있습니다

어떻게 같은 것을 변경할 수 있습니다. 어떤 자바 스크립트는 IE7을해야하는 경우 테이블 행에 onmosueover 클래스를 추가하고 제거하는 데 필요한 모든 다른 현대의 브라우저

tr:hover td { background-color:yellow } 
td.selected { background-color: green; } 
tr:hover td.selected { background-color: lime; } 

Fiddle

IE8 +에서 작동

순수 CSS의 솔루션을 필요로하지 않습니다 클래스 onmouseout.

tr:hover td, tr.hover td { background-color:yellow } 
td.selected { background-color: green; } 
tr:hover td.selected, tr.hover td.selected { background-color: lime; } 

Answer 2

내가 그 CSS를 가져가 함께 만드는 더 나은 동의하더라도, 나는 자바 스크립트와 그것을 수행하는 방법 질문에 답변을 좋아합니다.

당신은 하나 개의 속성에 저장하고 복원하는 데 사용할 수 있습니다 :

<script> 
function setBackground(me, color) 
{ 
    me.setAttribute("data-oldback", me.style.background);  
    me.style.background=color; 
} 

function restoreBackground(me) 
{ 
    me.style.background = me.getAttribute("data-oldback"); 
}  
</script> 

및

<tr onmouseover="setBackground(this, 'Red');" 
    onmouseout="restoreBackground(this);" 
    style="background:blue;" > 

및 테스트 : http://jsfiddle.net/AdDgS/3/이 http://jsfiddle.net/AdDgS/4/