简体   繁体   English

使用jquery addClass()更改颜色的文本

[英]Text not changing color with jquery addClass()

http://jsfiddle.net/GHJX5/ http://jsfiddle.net/GHJX5/

I have a div with blue text and I want it to change on hover to yellow. 我有一个带蓝色文本的div,我希望它在悬停为黄色时更改。 For some reason, if I remove the CSS part that sets it blue it will change to yellow on hover, but if it's set to blue it will not. 出于某种原因,如果我删除将其设置为蓝色的CSS部分,它将在悬停时变为黄色,但如果将其设置为蓝色则不会。

JS JS

$('#registerbutton').hover(
    function() {
        $('#registerbutton').addClass('asd');
    }, function() {
        $('#registerbutton').removeClass('asd');
    }
);

HTML HTML

<div id="registerbutton">click</div>

CSS CSS

#registerbutton{
    color:blue;
}
.asd{
    color:yellow;
}

An ID is more specific than a class, therefore the class gets overruled. ID比类更具体,因此该类被否决。 Try this instead: 试试这个:

#registerbutton.asd {
    color:yellow;
}

jsFiddle example jsFiddle例子

To learn more about CSS specificity, see https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity 要了解有关CSS特异性的更多信息,请参阅https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

为什么你不使用简单的CSS属性悬停像这样

#registerbutton:hover{color:yellow;}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM