부모 요소에 클래스가없는 경우 jQuery .on() 요소

Question

표제에 모두 나와 있지만 작동하지 않습니다. 호버 기능은 본문과 상관없이 작동합니다.

$("#content").on("click", "a.zoom", function(e) { 
    $("body").addClass("zoomed"); 
} 
$("#content").on("hover", "body:not(.zoomed) a.animation", function(e) { 
    //stuff 
} 

나는 또한 다른 방법을 시도했지만, 나는 그것을 얻지 못했다.

$(document).on("hover", "#content body:not(.zoomed) a.animation", yourHoverFunction); 

Answer 1

확인. 내가 틀린 기능을 비웃고있는 것을 발견하고 난 후에 나는 hover 이벤트 때문에 아직도 일할 수 없었다.

$("#content").on("hover", "a.backgroundSwitch", function(e) { 
    console.log("hello?"); 
}, function() { 
    console.log("bello!"); 
}); 

그래서 내가 이벤트 밖으로 마우스 오버 &을 unsing 리처드 닐 Ilagan의 솔루션을 사용 :

이 아무것도 (이 밤은 심지어 몸 클래스 검사)를 밝혀 없습니다.

$("#content").on("mouseover", "body:not(.zoomed) a.backgroundSwitch", function() { 
    console.log("hello"); 
}).on("mouseout", "body:not(.zoomed) a.backgroundSwitch", function() { 
    console.log("bello"); 
}); 

모든 도움에 감사드립니다!

Answer 2

. 귀하의 경우 루트 선택기를 #content으로 지정하고 일치 선택기를 body:not(.zoomed) a.animation으로 지정하면 루트 요소가 이벤트 버블 링에서 이미 전달되어 이벤트를 트리거합니다. 이를 위해 프로그래밍 방식으로 처리해야 할 수도 있습니다. 시도해보십시오

$("#content").on("hover", "a.animation", function(e) { 
    if($("body:not(.zoomed)").length > 1){ 
     //Do stuff here 
    } 
} 

Answer 3

on이 작동하려면 이벤트 버블 링을 활용 : 다른 리스너 선언에 대해 어떻게

$("body:not(.zoomed) #content").on("hover", "a.animation", function(e) { 
    //stuff 
}