2

ID の circle1、circle2 などの 4 つの div のいずれかを特定の色でクリックして、約 1 ～ 2 秒間見た図の適切な色を選択するという非常に単純なミニゲームを作成しています。

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 つの異なる図形が表示されます
  • あなたは今、それがどちらであったかを決定する必要があります（良い/悪いを選ぶなら...）

例

前もって感謝します。

4

2 に答える 2

1

クリックしたばかりの図の色を知りたいので、これを作成することをお勧めします。

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

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

編集 ：

コードに基づいて、jsFiddle を次のように更新しました: http://jsfiddle.net/8LFR7/3/。

2 つの主なエラーがありました。

  1. ID をターゲットにする場合は、ID の前に a を付ける必要があります#-> $("#" + wylosowane[losowa_z_wylosowanych_figur].figura).css('background-color')。
  2. テストの前に図を削除すると、削除する前に色をキャプチャして変数に保存する必要があります。ここでは、setTimeoutブロックの先頭に配置しました。var targetColor = $("#" + wylosowane[losowa_z_wylosowanych_figur].figura).css('background-color');
于 2013-06-11T07:17:45.357 に答える