jQuery로 호버 상태를 강제 설정하는 방법?

Question

하십시오, considere있는이 CSS 코드 :

a { color: #ffcc00; } 
a:hover { color: #ccff00; } 

이 HTML 코드 :

<a href="#" id="link">Link</a> 
<button id="btn">Click here</button> 

그리고 마지막으로,이 JS 코드 :

$("#btn").click(function() { 
    $("#link").trigger("hover"); 
}); 

내 링크 사용을하고 싶습니다 그 가상 클래스 : 버튼을 클릭 할 때 가리 키십시오. mousemove, mouseenter, hover 등의 이벤트를 실행하려고했지만 누구나 작동합니다. 나는 내 CSS 의사 클래스의 사용을 강제 할 주의 사항 :이 작업을 수행 할 방법을 알고

$("#link").css("color", "ccff00"); 

어떤 하나 사양을 가져와 같은 것을 사용하지? 정말 고마워.

Answer 1

클래스를 사용해야하지만 걱정하지 않아도됩니다. 매우 간단합니다. 먼저 :hover 규칙을 물리적으로 잡힌 링크에 적용 할뿐만 아니라 클래스 이름이 hovered 인 링크에도 적용합니다. 당신이 #btn을 클릭하면

a:hover, a.hovered { color: #ccff00; } 

다음으로, 우리는 #link에 .hovered 클래스를 전환 할 수 있습니다.

$("#btn").click(function() { 
    $("#link").toggleClass("hovered"); 
}); 

링크가 이미 클래스에 있으면 제거됩니다. 클래스가 없으면 추가됩니다.

Answer 2

또한 마우스 오버를 시도 할 수 있습니다.

$("#btn").click(function() { 
    $("#link").trigger("mouseover"); 
}); 

특정 시나리오에 맞는지 확실하지 않지만 다양한 경우에 마우스 오버 대신 마우스 오버가 성공했는지는 확실하지 않습니다.