私は単純な計算ゲームを作成しています。基本的に私が今いる場所は、数字が入力されたグリッドがあります。グリッドの横には 0 ~ 9 の数字があります。グリッド内の非表示の数字が強調表示されている場合、ユーザーは横にある正しい数字をクリックする必要があります。正しい場合は「wordglow3」クラスを使用し、間違っている場合は「wordglow4」クラスを使用する必要があります。整数が完成したとき (複数の数字がある場合)。いくつかの追加のクラスは、整数が正しいか間違っているかを判断するために引き継ぎます。正しいのは「wordglow2」で、間違っているのは「wordglow」です。
基本的には、グリッド内の数値を合計の答えにするランダムな合計を生成することを目的としています。各数値に添付された合計数をリストすることで手動でこれを行うつもりでしたが、グリッドで強調表示された回答に応じてスクリプトが合計を生成した方がよいと思います。この方法では、バックエンドの編集が少なくなり、ランダム化が増えます。
私はこのオンラインの例を探しましたが、運がありませんでした。誰かが私を正しい方向に向けることができますか?
現時点でのリストはこちら..
<ul style="display:none;" id="answerlist">
<li data-answer="1" data-add=""></li>
<li data-answer="2" data-add=""></li>
<li data-answer="3" data-add=""></li>
<li data-answer="4" data-add=""></li>
<li data-answer="5" data-add=""></li>
<li data-answer="6" data-add=""></li>
<li data-answer="7" data-add=""></li>
<li data-answer="8" data-add=""></li>
<li data-answer="9" data-add=""></li>
<li data-answer="10" data-add=""></li>
<li data-answer="11" data-add=""></li>
<li data-answer="12" data-add=""></li>
<li data-answer="13" data-add=""></li>
<li data-answer="14" data-add=""></li>
<li data-answer="15" data-add=""></li>
</ul>
ご覧のとおり、加算から始めて、方法がわかったら、より難しい演算子に進みたいと思います。
ユーザーの選択を受け入れるスクリプトは次のとおりです。
if ($('.drop-box.spellanswer').length == answerIsCorrect) {
$('.drop-box.spellanswer').addClass('answerglow2');
$(right).val('Right!');
$(right).show();
success.play();
$(wrong).hide();
score.right++;
score.attempts++;
if (score.right == 3) {
$('.answers').css('visibility', 'visible');
$('.answers').html("Well done! </br> You correctly spelt " + score.right + ". </br> Keep it up.").show();
$('table').fadeOut(3000);
$('.right').hide();
$('.box-style2').hide();
$('.box-style').hide();
$('.picstyle').hide();
$('.play').hide();
$('.minibutton2').hide();
$("#mysoundclip").attr('src', listOfWords[rndWord].audio);
audio.stop();
$("#mypic").attr('src', listOfWords[rndWord].pic);
pic.hide();
}
setTimeout(function() {
jQuery('.minibutton').trigger('click');
}, 1500);
setTimeout(function() {
jQuery(right).hide();
}, 1500);
} else {
$('.drop-box.spellanswer').addClass("answerglow4").css('color', 'transparent');
$(wrong).val('Wrong');
$(wrong).show();
failure.play();
$(right).hide();
score.wrong++;
score.attempts++;
if (score.wrong == 3) {
$(".minibutton").css('visibility', 'visible').prop('disabled', false);
}
$('.drop-box.spellanswer').animate({
'opacity': 1
}, 2000, function() {
$(this).removeClass('answerglow4').removeClass('occupied').html('')
});
setTimeout(function() {
jQuery(wrong).hide();
}, 1500);
}
}
});
}
});