1

我正在尝试在基于标签的 jQuery 函数中使用和，if例如：如果这样做，则执行其他操作。我试过这样：elsebackgroundColorlibackgroundColor = #ccc

if ($(this).css('backgroundColor = #EBE5C5')) {

但它不起作用，你能帮帮我吗？

嗯，非常感谢，但它仍然无法正常工作，请在此处查看完整功能：

$(function(){
$('.slider-nav li')
    .mouseover(function(){
        if ($(this).css('background-color') == "#EBE5C5") { 
            $(this).stop().animate({'backgroundColor':'#c0ba9f'},250);
        }
    })
    .mouseout(function(){
        $(this).stop().animate({'backgroundColor':'#EBE5C5'},250);
    })
});
4

4 回答 4

2

jQuery 给我们 RGB，而不是 HEX

jQuery 将在请求时返回一个rgb值。#CCC例如，如果您将背景颜色设置为#CCC，然后使用 jQuery 请求它：

$(".foo").css("backgroundColor"); // rgb(204, 204, 204)

从 RGB 获取 HEX

这意味着您需要有一种方法将 rgb 转换回 HEX。这个问题已经在 Stack Overflow 上被问及并得到了回答。请参阅使用 jQuery 获取 HEX 值而不是 RGB 值。出于我们的目的，我们可以使用以下函数：

//Function to convert hex format to a rgb color
function rgb2hex(rgb){
 rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
 return "#" +
  ("0" + parseInt(rgb[1],10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[2],10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[3],10).toString(16)).slice(-2);
}

使平滑的背景颜色动画成为可能

这将负责检索和比较。接下来，您需要加载$.animate()稍微扩展该方法的 jQuery UI 核心。

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui..."></script>

动画背景颜色

使用 jQuery UI 的核心就地（此处为完整路径），您可以执行以下操作：

$(".foo").animate({ backgroundColor: "#999999" }, 1000);

这将#999999在一秒钟内逐渐为背景设置动画。

现在都在一起了

所以最后我们有以下内容（假设 jQuery UI 的核心是链接的）：

//Function to convert hex format to a rgb color
function rgb2hex(rgb){
 rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
 return "#" +
  ("0" + parseInt(rgb[1],10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[2],10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[3],10).toString(16)).slice(-2);
}

$("#hello").on("click", function(e){
  background = rgb2hex( $(this).css("backgroundColor") );
  if ( background == '#cccccc' ) {
    $(this).animate({
      backgroundColor: "#123456",
      color: "#fff"
    }, 1000);
  }
});

在线演示：http: //jsbin.com/uwiyon/edit#javascript,html

于 2012-04-18T21:21:48.873 回答
1

应该是这样的：

if ($(this).css('background-color') == 'red') {
   // do somethig
} else {
   // do something else
}

请记住，一个等号是赋值。

这是jsFiddle：

http://jsfiddle.net/F6WeR/1/

于 2012-04-18T21:07:54.633 回答
0

尝试：

if( $(this).css('backgroundColor').indexOf('#EBE5C5')!=-1 )

使用 .css 和选择器获取值。然后你看看是否包含新值

这也应该有效，但是您必须查看该值是否有效地返回了该值。首先检查值

$(this).css('backgroundColor')

然后尝试

if( $(this).css('backgroundColor')=='#EBE5C5' )
于 2012-04-18T21:09:35.527 回答
0

您必须进行比较，“$（this）.css（“backgroundColor”）”返回背景颜色

if ($(this).css("backgroundColor") === "#EBE5C5") {

注意严格比较的三个等号（您也可以使用“==”，但这个更快一点）

于 2012-04-18T21:09:59.463 回答