1

我最近看到了与此类似的帖子，但是答案无效。我正在尝试制作一个连接四游戏，基本上我的问题是每次我单击一个框时它都会改变颜色，但是如果我单击一个彩色框它也会将其更改为下一个颜色。如果每个盒子是红色或黄色，我希望每个盒子都保持这种颜色。

 if ($(this).css('background-color') == $(this).css('background-color', 'silver'))

或者

 if ($(this).css('background-color') != 'red') || (if ($(this).css('background-color')  !='yellow))

它只是跳过了这个 if 语句？

4

3 回答 3

1

对于您的第一个if陈述，更改：

if ($(this).css('background-color') == $(this).css('background-color', 'silver'))

至：

if ($(this).css('background-color') == 'silver')

调用将该元素的$(this).css('background-color', 'silver'))设置background-color为银，并尝试将其background-color作为对象与自身进行比较。

您的第二个if陈述格式错误，无法正常工作。将其更改为：

if ($(this).css('background-color') != 'red' || $(this).css('background-color') !='yellow')

但是请注意，这始终是正确的，因为您要问的是背景不是红色还是背景不是黄色。如果背景为红色，则背景不会为黄色，反之亦然。将其更改||为&&.

于 2013-05-16T13:56:15.483 回答
1

该.css方法在不同的浏览器中有不同的输出：

$('<div>').css('background-color', 'red').css('background-color');

// Google Chrome
// "red"

// Mozilla Firefox
// "rgb(255, 0, 0)"

另一个例子：

$('<div>').css('background-color', 'rgba(0, 0, 0, 0)').css('background-color');

// Google Chrome
// "rgba(0, 0, 0, 0)"

// Mozilla Firefox
// "transparent"

解决方案

Working FIDDLE Demo

创建一个对象来存储所有可能情况下的所有颜色：

var colors = {
    'red'  : ['red'  , '#FF0000', '#ff0000', 'rgb(255, 0, 0)', 'rgba(255, 0, 0, 1)'],
    'green': ['green', '#00ff00', '#00FF00', 'rgb(0, 255, 0)', 'rgba(0, 255, 0, 1)']

    // etc
};

现在您可以使用$.inArray方法进行比较：

HTML

<div id="test1" style="background-color: red;">I am RED</div>
<div id="test2" style="background-color: blue;">I am Blue</div>

JS

// you want to see if `elem_color` is `red`
// just like this: elem_color == 'red'

var elem_color = $('#test1').css('background-color');

if ($.inArray(elem_color, colors['red']) > -1) {
    alert('Element is RED');
}

// you want to see if `elem_color` is not `green`
// just like this: elem_color != 'green'

var elem_color = $('#test2').css('background-color');

if (! ($.inArray(elem_color, colors['green']) > -1)) {
    alert('Element is not GREEN');
}
于 2013-05-16T13:59:57.413 回答
0

你用#FF0000还是普通的红色？如果您的红色是#FF0001，它不会将其识别为红色。

您需要使您的声明与原始颜色完全相同，应该可以！

于 2013-05-16T13:54:27.507 回答