sub-div 마우스가 있는지 확인

Question

이 질문을하는 방법을 100 % 확신 할 수 없습니다. 이해한다면 편집하십시오.

sub-div 마우스 오버 이벤트가 있는지 확인하고 싶습니다. 하지만 작동하지 않습니다. 내 현재 코드는 이것이다 :

$('#mc').hover(function() { 
    if (selectedCoding !== 1) 
     $(this).css({"color":"red"}); 
    else 
     $(this).css({"color":"white"}); 
}, function() { 
    if (selectedCoding !== 1) 
     $(this).css({"color":"white"}); 
    else 
     $(this).css({"color":"red"}); 
}); 

#mc는 곳입니다 : 여기

<div id="coding"> 
    <ul> 
     <li id="mc"> 
      <img src="images/minecraft.png"> 
      <h3>Minecraft Plugins</h3> 
      <p>Description text</p> 
     </li> 
    </ul> 
</div> 

문제는 그것이 jQuery를 기능에 #mc 발견하지 않는다는 것입니다. 아래

$('#webbox').load('codinghelp.html'); 

모든 것은 내부에 "codinghelp.html"내 index.php 파일에서

, 난이 작은 코드가

<div id="coding"> 
    <ul> 
     <li id="mc"> 
      <img src="images/minecraft.png"> 
      <h3>Minecraft Plugins</h3> 
      <p>Description text</p> 
     </li> 
    </ul> 
</div> 
<span style="color:green" id="request"> </span> 

내가로부터 #mc 찾을 수없는 내 index.php 파일을 찾을 수 있지만이 코드가 작동하기 때문에 #request를 찾을 수 있습니다.

$('#request').text('Minecraft'); 

Answer 1

이 문제를 해결하려면 CSS를 사용하는 것이 좋을 것입니다. 이벤트 바인딩과 동적 요소에 대해 걱정할 필요가 없습니다. selectedCoding 값이 변경되면 mc에 클래스를 설정하기 만하면됩니다.

는

Working Demo

jQuery를

$('#mc').addClass((selectedCoding !== 1 ? 'selected' : 'selectedInverse')); 

내 코드 외부 CSS

.selected { 
    color: white; 
} 
.selected:hover { 
    color: red; 
} 

.selectedInverse { 
    color: red; 
} 
.selectedInverse:hover { 
    color: white; 
}