javascript - 匹配div的正确颜色

Question

我正在制作一个非常简单的迷你游戏，它的想法是通过单击具有特定 id 的 circle1、circle2 等的四个 div 中的一个，为您已经看到大约一两秒钟的图形选择合适的颜色。颜色:

var odpowiedz_kolor = $('<div class="label id="gra">Jaki kolor miał następujący kształt?</br></br><ul class="inline">'+
                '<div class="odpowiedz_pojemnik" id="' + wylosowane[losowa_z_wylosowanych_figur].figura + '"> </div></br></br>'+
                '<ul class="inline">'+
                '<li><div class="kolo" id="kolo1"> </div></li>'+
                '<li><div class="kolo" id="kolo2"> </div></li>'+
                '<li><div class="kolo" id="kolo3"> </div></li>'+
                '<li><div class="kolo" id="kolo4"> </div></li>'+
            '</ul></div>');

我删掉了不必要的代码...

$('#kolo1').css('background-color', wylosowane[0].kolor);
$('#kolo2').css('background-color', wylosowane[1].kolor);
$('#kolo3').css('background-color', wylosowane[2].kolor);
$('#kolo4').css('background-color', wylosowane[3].kolor);
$(".kolo").on('click', function(){
var color = $('.kolo').find('#kolo').css('background-color');

我已经设置了如上所示的颜色。现在的问题是如何检索相应的颜色，因为我卡在了点击处理程序上。即使是丑陋但有效的解决方案，我也会很感激。

场景是:

• 几秒钟内你会看到 4 个不同颜色的不同图形
• 你现在必须决定它是哪一个(如果选择好/坏那么......)

提前谢谢你。

Answer 1

你可能想知道你刚刚点击的图形的颜色，所以我建议你这样做:

$(".kolo").on('click', function(){
    var color = $(this).css('background-color');
}

JsFiddle:http://jsfiddle.net/F3HB5/

---

编辑:

根据您的代码，我已将您的 jsFiddle 更新为这个:http://jsfiddle.net/8LFR7/3/ .

主要有两个错误:

1. 当你想定位一个 id 时，你必须在 id 之前放一个 # -> $("#"+ wylosowane[losowa_z_wylosowanych_figur].figura).css('background -颜色').
2. 当你在测试前移除你的图形时，你必须在移除它之前捕获颜色并将它保存在某个变量中:这里我把它放在 setTimeout block 的开头:var targetColor = $("#"+ wylosowane[losowa_z_wylosowanych_figur].figura).css('背景色');