我有这样的课
<div class="Ratsheet-destination-detail"></div>
$(".Ratsheet-destination-detail").css("backgroundColor", #5B815B);
现在“Ratsheet-destination-detail”具有红色背景色。
我如何检查它是否有背景颜色,如果它有然后将其背景颜色更改为“#616161”
谢谢.......
我有这样的课
<div class="Ratsheet-destination-detail"></div>
$(".Ratsheet-destination-detail").css("backgroundColor", #5B815B);
现在“Ratsheet-destination-detail”具有红色背景色。
我如何检查它是否有背景颜色,如果它有然后将其背景颜色更改为“#616161”
谢谢.......
您的颜色将作为 rgb 值返回。所以检查背景颜色的rgb值。如果是红色rgb(255, 0, 0)
,则将其更改为绿色。
var el = $('.Ratsheet-destination-detail');
if(el.css('background-color') == 'rgb(255, 0, 0)'){
el.css('background-color','green');
}
如果我理解正确,通过操作的编辑这应该可以工作。如果背景为红色或灰色,这会将其更改为绿色。
var el = $('.Ratsheet-destination-detail');
if(el.css('background-color') == 'rgb(97, 97, 97)' || el.css('background-color') == 'rgb(255, 0, 0)'){
el.css('background-color','green');
}
该$.css
方法将告诉您匿名函数中的旧颜色是什么:
$(".Ratsheet-destination-detail").css("background-color", function( index, old ){
// If current is red, set to green, else set to red
return $.Color(old).is("red") ? "green" : "red" ;
});
在这里,我使用jQuery Color 插件来$.Color()
帮助处理颜色。如果没有它,您将不得不处理 RGB(或可能的 RGBA)格式的颜色,例如rgb(255, 0, 0)
,这有时可能会有点混乱。
演示:http: //jsbin.com/egemaf/2/edit
为了使用 jQuery Color 插件,您需要从项目中下载并引用源代码,就像使用 jQuery 一样(假设您没有使用 CDN):
<!DOCTYPE html>
<html>
<head>
<title>Swapping Background Colors with jQuery and jQuery Color</title>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.2.min.js"></script>
<script src="https://raw.github.com/jquery/jquery-color/master/jquery.color.js"></script>
</head>
<body>
<div class="Ratsheet-destination-detail">
<p>Hello, World.</p>
</div>
<script>
$(function(){
$(".Ratsheet-destination-detail").css("background-color", function(i, old){
// If current is red, set to green, else set to red
return $.Color(old).is("red") ? "green" : "red" ;
});
});
</script>
</body>
</html>