簡単な学校のクイズ-JavaScriptに基づくプロジェクト。これらは、クイズ全体で構成されるファイルです。
- Quiz.html: http ://www.rapidimg.org/server/files/50ab9c326115cKAUf6S.png
- Quiz_questions.js: http ://www.rapidimg.org/server/files/50ace68ad21d9GPIha7.png (画像の後ろにランダムな文字が表示され、回答が読み込まれることを示します)
- Quiz_functions.js:これが主な目的です。以下を参照してください。
- 出力: http ://www.rapidimg.org/server/files/50ace6c57c01aTsZpMk.png (これは正しいです!)
1つの質問に対応する回答が読み込まれるため、正常に機能します。(上記の出力を参照してください)。答えを選択するかしないかで「次の質問」をクリックするとすぐに、2つの異なることが起こります。
回答が選択されていません: http : //www.rapidimg.org/server/files/50ace9123bce6TzoiqL.png-質問2 +の回答を読み込みますが、ページを無限の読み込み状態にします。別の回答をクリックして[次の質問]をクリックすると、Firebugは次のように表示します:http ://www.rapidimg.org/server/files/50ace9a08b88aqLFZ1K.png
回答を選択しました: http : //www.rapidimg.org/server/files/50acea1422aed6gZkcL.png-質問3 +回答(???)をロードしますが、ページを無限にロードします。回答+[次の質問]ボタンをクリックしたときの上記と同じエラー:http ://www.rapidimg.org/server/files/50acea4e4bc3cLn8g2U.png
これが実現されている「quiz_functions.js」のコードは次のとおりです。
var useranswers = new Array();
var imgArray = new Array();
var answered = 0;
var currentQuestion = 0;
function renderQuizViaArray()
{
document.write('<h1>' + questions[currentQuestion] + '</h1>');
for(i=0, j=choices[currentQuestion].length; i < j; i++)
{
document.writeln('<input type="radio" name="answer_' + currentQuestion + '" value="1" id="answer_' + currentQuestion + '_' + i + '" class="question_' + currentQuestion + '" onclick="submitAnswer(' + currentQuestion + ', this, \'question_' + currentQuestion + '\', \'label_' + currentQuestion + '_' + i + '\')" /><label id="label_' + currentQuestion + '_' + i + '" for="answer_' + currentQuestion + '_' + i + '"> ' + choices[currentQuestion][i] + '</label><br />');
}
document.write('<input type="submit" value="Next Question" onclick="nextQuestion()" />');
}
function nextQuestion()
{
currentQuestion++;
renderQuizViaArray();
}
function submitAnswer(questionId, obj, classId, labelId)
{
useranswers[questionId] = obj.value;
document.getElementById(labelId).style.fontWeight = "bold";
disableQuestion(classId);
answered++;
}
function disableQuestion(classId)
{
var alltags = document.all? document.all : document.getElementsByTagName("*")
for (i = 0; i < alltags.length; i++)
{
if (alltags[i].className == classId)
{
alltags[i].disabled = true;
}
}
}