특정 클래스가 아닌 DOM 요소의 이벤트를 캡처하십시오.

Question

나는 일련의 탭을 가지고 있으며 그들에게 mouseover 기능을 추가하려고합니다. 이 기능을 .active에 적용하고 싶지 않습니다.

마크 업 :이 시도

<ul> 
    <div class='tab'>my tab</div> 
    <div class='tab' data-id='1'>your tab</div> 
</ul> 

<script> 
    $('.tab').on('click',function(){ 
    $(this).addClass('active'); 
    }); 
</script> 

:

$('.tab').not('.active').on('mouseover', function(){ 

및

$('.tab:not(.active)').on('mouseover', function(){ 

그러나이 작품의도. 해당 기능을이 기능에서 어떻게 제외합니까?

Answer 1

하나의 가능한 문제는 다른 섹션의 클릭에 대한 응답으로 addClass를 통해 활성을 추가한다는 것입니다. 위의 구문이 이것을 처리합니까?

이것이 문제입니다. 로드시 mouseover 이벤트를 추가 할 때 활성 클래스가 없으므로 .not()은 아무 것도 제외하지 않습니다. 대신 처리기 자체의 클래스를 확인해야합니다.

이 시도 : http://jsfiddle.net/9vJP2/ :

$('.tab').on('mouseover', function() { 
    if (!$(this).hasClass("active")) { 
     // your code here 
     $(this).css("background-color", "#C00"); 
    } 
}); 

$(".tab:last").addClass("active"); 

Example fiddle