Как заставить состояние зависания с 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.

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

Далее, при нажатии кнопки #btn, мы переключить .hovered класс на #link.

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

Если ссылка уже имеет класс, она будет удалена. Если у него нет класса, он будет добавлен.

Answer 2

Кроме того, вы можете попробовать запустить курсор мыши.

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

Не уверен, если это будет работать для конкретного сценария, но я имел успех запуска MouseOver вместо парение для различных случаев.