-1

私はごく最近 HTML/Javascript などを始めたばかりなので、非常に素人のコードを許してください。

ここでは航空管制官向けのクイズ型アプリを作っています。テキスト入力ボックスに正しい答えを入力すると、データブロックが変更されて新しい高度が反映されます。試してみると、美しく動作します。しかし、カウンターを使用して正しい応答と誤った応答を追跡しようとすると、最初の回答の後、カウンターは常に最初に誤った応答を記録し、その直後に正しい応答を記録します。したがって、2 つの質問に正しく答えた場合、終了ボタンは、2 つの質問が正しく、1 つの質問が間違っていることを示します。

これが私のコードです：

<script>
var correctAns = 0;
var incorrectAns = 0;


var newProblem = function() {
var AircraftData = new Aircraft();
$("#altitudeLine").focus();
$("#problem").html(AircraftData.newAlt);
$("#callsign").html(AircraftData.callsign);
$("#altitudeLine").html(AircraftData.initAltitude + "C");
$("#aid").html(AircraftData.aid);
$("#speed").html(AircraftData.speed);
$("#altInput").focus();

$(document).keydown(function(e) { 
    var correctAnswer = "QQ" + " " + AircraftData.newAlt + " " + AircraftData.aid;
    var userAnswer = $("#altInput").val().toUpperCase();
    if (e.which == 13) {
        if (correctAnswer == userAnswer) {
            $("#feedback").html("Correct!");
            $("#altitudeLine").html(AircraftData.newAlt + "T" + AircraftData.initAltitude);
            correctAns++;
            return;
        }
        else {
            $("#feedback").html("Incorrect!");
            incorrectAns++;
            return;
        }
    }       
});
}


function clearProblem() {
$("#feedback").html("");
$("#altInput").val("");
$("#altInput").focus();
setTimeout(newProblem(), 2000);
}

function results() {
alert("Correct: " + correctAns + " | Incorrect " + incorrectAns);
}
</script>
</head>

// stripped out a lot of code not relevant

<button onClick="newProblem()">Start</button>
    <button id="next" onClick="clearProblem()">Next</button>
    <span id="problem"></span>
    <input type="text" id="altInput">
    <span id="feedback"></span>
    <br />
    <button id="quitButton" onClick="results()">Quit</button>
</div>
4

1 に答える 1

1

コードの一部を修正した後、私はあなたの問題に気付きました。新しい問題があるたびに keydown イベントの新しいイベント ハンドラーを定義しており、古いイベント ハンドラーを決して削除していません。

off() を使用して既存のハンドラーを削除し、on() を使用して新しいハンドラーを設定して、常に 1 つだけになるようにする必要があります。

$(document).off('keydown');
$(document).on('keydown', function () { ... });

しかし、新しい問題が発生するたびにイベント ハンドラを再定義する必要があるでしょうか。変更されているのは、比較する correctAnswer 値だけです。ハンドラーを実際に一度定義し、正しいAnswer値を動的に決定する必要があります。

于 2013-05-06T16:31:07.683 に答える