0

乱数ジェネレーターを使用して「正しい」ボックスを割り当てる推測ゲームがあります。
あなたが推測したボックスが間違っている場合は、フェードアウトさせてください。

これは、フェードするために 2 回クリックする必要があることを除いて、これを行います。

最初のクリックでincorrect();正常に呼び出され、2 回目のクリックでのみfade();正常に呼び出されます。関数 one() と同じコードを持つ他の 5 つの関数があり、これらは異なるボックス/div に関連しており、jquery を 6 回通過したくありません。

これを修正する方法についてのアイデアはありますか?

編集: これは jsFiddle で、さらにコードを見る必要があります。答えやすくなるかもしれません: http://jsfiddle.net/JMqxq/

function correct() {
    document.getElementById("result").innerHTML = "You are correct!";
}

function incorrect() {
    document.getElementById("result").innerHTML = "Sorry, you are incorrect.";
}

function fade() {
    $(document).ready(function () {
        $(temp2).click(function () {
            $(this).animate({
                "opacity": "0.25"
            },
                "slow");
        });
    });
}


function one() {
    temp2 = "#one";

    if (temp == 1) {
        correct();
    } else {
        fade();
        incorrect();
    }
}
4

4 に答える 4

2

ページに jQuery が含まれている場合は、使用しないでください。

まず、データ属性を使用してボックスに関する情報を保存します。

<div class="box" id="one" data-id="1">
<div class="box" id="two" data-id="2">
<div class="box" id="three" data-id="3">
...

このようなdivクラスを持つすべての要素のクリックイベントリスナーを直接追加できます。box

$("div.box").click(function() {
      if (temp == $(this).data("id")) {
          correct();
      } else {
          $(this).animate({"opacity": "0.25"}, "slow");
          incorrect();
      }
  });

そして、ここに更新された動作中のjsFiddle DEMOがあります

于 2013-04-28T00:17:29.730 に答える