-2

我该怎么做：

http://codepen.io/anon/pen/xeBmt

function updateColor(hexValue) {
    $('a').css({"color" : "#" + hexValue});
}

$('body').on('click', 'li', function() {
    var hexValue = $(this).attr('data-color');
    updateColor(hexValue); 
});

并使其仅在十六进制值为 时更改a颜色#dddddd ？

4

2 回答 2

2 
if($('a').css('color') == '#dddddd') {
    $('a').css({"color" : "#" + hexValue});
}

把它放在函数中。

编辑

function updateColor(obj, hexValue) {
    obj.css("color",hexValue);
}
$('a').click(function() {
    if($(this).css('color') == 'rgb(221, 221, 221)'){
        var hexValue = $(this).data('color');
        updateColor($(this), hexValue);
    }     
});

这行得通。我对 rgb 的错误。也有一个小提琴。http://jsfiddle.net/SYBez/1/

但是就像@JasonSperske 所说，一旦颜色发生变化，您的代码就会失去它随着颜色变化而起作用的能力。我不知道你试图做什么的目的，但我会使用数据、类或其他东西来解决这个问题，因为依赖颜色作为选择器对我来说似乎很奇怪。

于 2013-02-06T23:17:43.160 回答
1

好的，这可能不是您要寻找的答案，但是这段代码会（我认为）您所要求的（演示）。首先，您需要对标记进行一些更改（我试图展示这些更改的各种排列以及每种排列的工作方式）

让我们从 HTML 开始。这里我添加了一个带有颜色的 CSS 规则（称为Change） ，以及一个带有相同颜色的短版 ( )#ddddd的内联样式#ddd

<ul>
  <li data-color="f00">Red</li>
  <li data-color="0f0">Green</li>
  <li data-color="00f">Blue</li>
  <li data-color="ff0">Yellow</li>
  <li data-color="f0f">Purple</li>
</ul>
<a href="#" class='Change'>Look at my color</a>
<a href="#">Look at my color</a>
<a href="#" class='Change'>Look at my color</a>
<a href="#">Look at my color</a>
<a href="#" style='color: #ddd;'>Look at my color</a>

然后是 CSS（你的 CSS 有很多规则可以为每个框着色，我刚刚添加了这个：

a.Change {
  color: #dddddd;
}

最后是脚本：

function updateColor(hexValue) {
  $('a').filter(function () {
    return $(this).css('color') == 'rgb(221, 221, 221)';
  }).css({
    "color": "#" + hexValue
  });
}

$('body').on('click', 'li', function () {
  var hexValue = $(this).attr('data-color');
  updateColor(hexValue);
});

如果您单击其中一个块，则只有颜色为#dddddd( rgb(221, 221, 221)) 的链接将被更新。但是，一旦您更新它们，它们将不再具有您的原始颜色，因此第二次单击它将不起作用（这就是为什么我想知道这个答案是否真的对您尝试做的事情有帮助））

于 2013-02-06T23:52:44.883 回答