jQuery/css addClass（）样式覆盖以前的样式属性

我有一个div，其默认类给它一个绿色的背景。当按下鼠标时，我想将背景改为红色，直到鼠标松开。jQuery/css addClass（）样式覆盖以前的样式属性

我试着用红色背景色添加一个类。新的类属性似乎不覆盖现有的属性。我在.css文件中的原始文件后面列出了新班级。

CSS

#calc_no { background-color: #cd9781; } 
#calc_yes { background-color: #8fba8e; } 
.button_click { background-color: red; }

的JScript

$('.button').live('mousedown', function() { 
    $(this).addClass("button_click"); 
}); 
$('.button').live('mouseup', function() { 
    $(this).removeClass('button_click'); 
});

HTML

<div id="calc_yes" class="kp_button button">Yes</div>

来源

2010-11-20 David Houde

问题在于ID覆盖类定义。在类中改变背景而不是ID

来源

2010-11-20 19:20:06

谢谢，这个作品perfectl.y – 2010-11-20 19:26:58

感谢aletzo过，他得到了它第一个（而我正在写我的）。 upvotes是一种很好的方式来说Stack Overflow中的想法。好运编码，水手！ – 2010-11-20 19:28:11

IDS>类

你可以使用.calc_no和.calc_yes代替

来源

2010-11-20 19:18:20 aletzo

谢谢，这工作完全 – 2010-11-20 19:27:34

在CSS中，不同类型的选择器具有不同的权重。例如，一个id比一个比标签名称重量更大的类具有更大的权重。因此，您的基于id的样式正在覆盖基于类的样式。

对于这个简单的情况下，尝试使用!important关键字：

.button_click { background-color: red !important; }

来源

2010-11-20 19:28:56

这个ID是一个正确的答案，但使用'！important'应该是最后的解决方案，因为它会打破级联规则并导致稍后维护代码的问题。 – 2010-11-20 19:49:10

jQuery/css addClass（）样式覆盖以前的样式属性

回答

相关问题