jquery - 禁用html标签的悬停状态

Question

我想禁用我的 html 元素的悬停状态，但不使用另一个 css 来覆盖悬停的 css。

这是我的代码行：

<div id="test">
    Hello world
</div>

<style>
    #test {color: red; border: 1px blue solid;}
    #test:hover {color: green; border: 1px blue solid;}
</style>

在这种情况下，当鼠标悬停时，“Hello world”将变为绿色，但我不希望鼠标悬停时发生任何事情，并且不添加/覆盖新的 CSS 来禁用悬停。有没有办法通过 javascript/jquery 禁用悬停状态？

请帮我。谢谢

Answer 1

You can disable hover state with this jQuery code:

$(document).ready(function () {
    $('#test').hover(
      function () {
        $('#test').css('color','red');
      }
    );
});