1

以下のスクリプトは、乱数を生成し、答えを計算します。

次は、答えを非表示にして、そこにテキスト領域を配置したいということです。次に、答えを入力する必要があり、答えが正しい場合は、答えが緑色になります。

可能であることはわかっていますが、インターネットで検索してもうまくいかなかったので、代わりに質問を作成しています。

スクリプトは次のとおりです。

<div id="breuken"></div>

$(function () {
    var number = document.getElementById("breuken");
    var i = 0;
    for (i = 1; i <= 10; i++) {
        var sRandom = Math.floor(Math.random() * 10);
        var fRandom = Math.floor(sRandom + Math.random() * (10 - sRandom));
        var calc = Math.abs(fRandom - sRandom);
        number.innerHTML += "" + fRandom + " - " + sRandom + " = " + calc + "<br />";
    }
    number.innerHTML;
});
4

3 に答える 3

1

これを試してくださいhttp://jsfiddle.net/r4QTQ/

それは基本的な緑色の変化をしますが、あなたが修正してあなたが望むことを正確に行うのに十分なはずです。

于 2012-04-12T08:45:50.277 に答える
1

jQueryを使用している場合、正しい方向に役立つ可能性のあるこのjQueryデモを作成しました。

var $questions = $('<div />').attr('id', 'questions');
for (var i = 1; i <= 3; i++) {

    var question = "Question " + i + "?";
    var answer = i;

    $questions.append(
        $('<div />')
            .attr('id', 'question' + i)
            .addClass('question')
            .append(
                $('<span />').text(question)
            )
            .append(
                $('<input type="text" />')
                    .addClass('answer')
                    .data('answer', answer)
            )
    );
}
$('#container').empty().append($questions);

それが役に立てば幸い！

于 2012-04-12T09:19:30.477 に答える
0

この回答は、@gillesc のものと実質的に同じjQueryですが、手元にある場合は使用する必要がある重労働を行うために使用します。（そして短い）

Javascript コード: jsFiddle

$(function() {
    var checkAnswer = function(elem) {
        if ($(elem).data('calc') == $(elem).val()) {
            $(elem).css('background-color', 'green');
        } else {
            $(elem).css('background-color', 'white');
        }
    };
    var div = $('#breuken');

    for (var i = 0; i < 10; i++) {
        var sRandom = Math.floor(Math.random() * 10);
        var fRandom = Math.floor(sRandom + Math.random() * (10 - sRandom));
        var calc = Math.abs(fRandom - sRandom);

        var qa = $('<span>' + fRandom + ' - ' + sRandom + 
            ' = <input type="text"></span><br />');
        qa.find('input').change(function() {
            checkAnswer(this);
        }).data('calc', calc);
       div.append(qa);
    }
});
于 2012-04-12T09:09:57.427 に答える