2011-12-30 28 views
0

我有以下多項選擇JavaScript測驗,我想修改以幫助給我更詳細的測驗者表現的信息。我想改變腳本,以便不要給我一個單獨的綜合分數,我希望輸出中包含一個反映我如何分類問題的分數列表。爲了做到這一點,我需要將現有數組分解成數組子集,其中一些包含重疊問題。例如,我想在「javascript」下將問題#1-3分組,但在WindowsOS下分組#3,而在#1 &#5下基本編程等。我該怎麼做?非常感謝您提前!javascript多選腳本

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>The JavaScript Source: Miscellaneous : Multiple Choice Quiz</title> 

<style type="text/css"> 
<!-- 
.question { 
    color:darkblue; 
    font-size:14px; 
    font-weight:bold; 
} 
--> 
</style><script type="text/javascript"> 

var useranswers = new Array(); 
var answered = 0; 

function renderQuiz() { 
    for(i=0;i<questions.length;i++) { 
    document.writeln('<p class="question">' + questions[i] + ' <span id="result_' + i + '"><img src="blank.bmp" style="border:0" alt="" /></span></p>'); 
    for(j=0;j<choices[i].length;j++) { 
     document.writeln('<input type="radio" name="answer_' + i + '" value="' + choices[i][j] + '" id="answer_' + i + '_' + j + '" class="question_' + i + '" onclick="submitAnswer(' + i + ', this, \'question_' + i + '\', \'label_' + i + '_' + j + '\')" /><label id="label_' + i + '_' + j + '" for="answer_' + i + '_' + j + '"> ' + choices[i][j] + '</label><br />'); 
    } 
    } 
    document.writeln('<p><input type="submit" value="Show Score" onclick="showScore()" /> <input type="submit" value="Reset Quiz" onclick="resetQuiz(true)" /></p><p style="display:none"><img src="correct.bmp" style="border:0" alt="Correct!" /><img src="incorrect.bmp" style="border:0" alt="Incorrect!" /></p>'); 
} 
function resetQuiz(showConfirm) { 
    if(showConfirm) 
    if(!confirm("Are you sure you want to reset your answers and start from the beginning?")) 
     return false; 
    document.location = document.location; 
} 
function submitAnswer(questionId, obj, classId, labelId) { 
    useranswers[questionId] = obj.value; 
    document.getElementById(labelId).style.fontWeight = "bold"; 
    disableQuestion(classId); 
    showResult(questionId); 
    answered++; 
} 
function showResult(questionId) { 
    if(answers[questionId] == useranswers[questionId]) { 
    document.getElementById('result_' + questionId).innerHTML = '<img src="correct.bmp" style="border:0" alt="Correct!" />'; 
    } else { 
    document.getElementById('result_' + questionId).innerHTML = '<img src="incorrect.bmp" style="border:0" alt="Incorrect!" />'; 
    } 
} 
function showScore() { 
    if(answered != answers.length) { 
    alert("You have not answered all of the questions yet!"); 
    return false; 
    } 
    questionCount = answers.length; 
    correct = 0; 
    incorrect = 0; 
    for(i=0;i<questionCount;i++) { 
    if(useranswers[i] == answers[i]) 
     correct++; 
    else 
     incorrect++; 
    } 
    pc = Math.round((correct/questionCount) * 100); 
    alertMsg = "You scored " + correct + " out of " + questionCount + "\n\n"; 
    alertMsg += "You correctly answered " + pc + "% of the questions! \n\n"; 
    if(pc == 100) 
    alertMsg += response[0]; 
    else if(pc >= 90) 
    alertMsg += response[1]; 
    else if(pc >= 70) 
    alertMsg += response[2]; 
    else if(pc > 50) 
    alertMsg += response[3]; 
    else if(pc >= 40) 
    alertMsg += response[4]; 
    else if(pc >= 20) 
    alertMsg += response[5]; 
    else if(pc >= 10) 
    alertMsg += response[6]; 
    else 
    alertMsg += response[7]; 
    if(pc < 100) { 
    if(confirm(alertMsg)) 
     resetQuiz(false); 
    else 
     return false; 
    } else { 
    alert(alertMsg); 
    } 
} 
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; 
    } 
    } 
} 

var questions = new Array(); 
var choices = new Array(); 
var answers = new Array(); 
var response = new Array(); 

// To add more questions, just follow the format below. 

questions[0] = "1) JavaScript is ..."; 
choices[0] = new Array(); 
choices[0][0] = "the same as Java"; 
choices[0][1] = "kind of like Java"; 
choices[0][2] = "different than Java"; 
choices[0][3] = "ther written part of Java"; 
answers[0] = choices[0][2]; 

questions[1] = "2) JavaScript is ..."; 
choices[1] = new Array(); 
choices[1][0] = "subjective"; 
choices[1][1] = "objective"; 
choices[1][2] = "evil"; 
choices[1][3] = "object based"; 
answers[1] = choices[1][3]; 

questions[2] = "3) To comment out a line in JavaScript ..."; 
choices[2] = new Array(); 
choices[2][0] = "Precede it with two forward slashes, i.e. '//'"; 
choices[2][1] = "Precede it with an asterisk and a forward slash, i.e. '*/'"; 
choices[2][2] = "Precede it with an asterisk, i.e. '*'"; 
choices[2][3] = "Precede it with a forward slash and an asterisk, i.e. '/*'"; 
answers[2] = choices[2][0]; 

questions[3] = "4) JavaScript can only run on Windows"; 
choices[3] = new Array(); 
choices[3][0] = "True"; 
choices[3][1] = "False"; 
answers[3] = choices[3][1]; 

questions[4] = "5) Semicolons are optional at the end of a JavaScript statement."; 
choices[4] = new Array(); 
choices[4][0] = "True"; 
choices[4][1] = "False"; 
answers[4] = choices[4][0]; 

questions[5] = "6) The four basic data types are:"; 
choices[5] = new Array(); 
choices[5][0] = "strings, numbers, BooBoos, and nulls"; 
choices[5][1] = "strings, text, Booleans, and nulls"; 
choices[5][2] = "strings, numbers, Booleans, and nulls"; 
choices[5][3] = "strings, numbers, Booleans, and zeros"; 
answers[5] = choices[5][2]; 

// response for getting 100% 
response[0] = "Excellent, top marks!"; 
// response for getting 90% or more 
response[1] = "Excellent, try again to get 100%!" 
// response for getting 70% or more 
response[2] = "Well done, that is a good score, can you do better?"; 
// response for getting over 50% 
response[3] = "Nice one, you got more than half of the questions right, can you do better?"; 
// response for getting 40% or more 
response[4] = "You got some questions right, you can do better!"; 
// response for getting 20% or more 
response[5] = "You didn't do too well, why not try again!?"; 
// response for getting 10% or more 
response[6] = "That was pretty poor! Try again to improve!"; 
// response for getting 9% or less 
response[7] = "Oh dear, I think you need to go back to school (or try again)!"; 

//--> 
</script> 

<link id="noteanywherecss" media="screen" type="text/css" rel="stylesheet" href="data:text/css,.note-anywhere%20.closebutton%7Bbackground-image%3A%20url%28chrome-extension%3A//bohahkiiknkelflnjjlipnaeapefmjbh/asset/deleteButton.png%29%3B%7D%0A"></head> 
<body bgcolor="#ffffff" vlink="#0000ff"> 


<br> 
<center> 
<script language="JavaScript" type="text/javascript"><!-- 
function openDescription(ID) { 
var url = "http://www.ppcforhosts.com/public/util/description.cfm?id=" + ID; 
link = window.open(url,"newWin","directories=0,height=250,location=0,menubar=0,resizable=1,scrollbars=1,status=0,toolbar=0,width=450"); 
} 
//--></script> 
<table cellpadding="10" cellspacing="0" border="0" width="100%"> 
    <tbody><tr><td align="center"> 
<!-- cdXpo code --> 


<center> 
<span class="quad_R"> 
href="http://o1.qnsr.com/cgi/r?;n=203;c=662698/662688/662676/662675/581034;s=10665;x=7936;f=38775509;u=j;z=20110808154704" target="_blank"&gt; 
&lt;img border="0" width="0" height="0" src="http://o1.qnsr.com/cgi/x?;n=203;c=662698/662688/662676/662675/581034;s=10665;x=7936;f=38775509;u=j;z=20110808154704" alt="Click here"&gt;&lt;/a&gt; 
</noscript> 
</span> 
+0

這是太多的代碼,真的。你爲什麼不告訴我們更多關於你已經嘗試過的以及哪些不起作用的東西? – sczizzo 2011-12-30 16:51:08

回答

1

如果您將問題數組更改爲JavaScript對象字面符號,代碼的可維護性將會增加。然後,您可以爲每個問題提供一組可用於根據組進行評分的組屬性。這裏是一個例子:

var questions = [ 
    { 
     question: "5) Semicolons are optional at the end of a Javascript statement.", 
     groups: [ 
      "Javascript", 
      "HTML" 
     ], 
     answer: "True", // could also be replaced with the index of the correct choice to avoid possible typos. 
     choices: [ 
      "True", 
      "False" 
     ] 
    }, 
    // other questions... 
] 
+1

這是一個很好的答案,只是我將組屬性更改爲數組,以符合在多個組中具有單個問題的要求。也許組數組應該是指向另一個全局數組的索引數組,它列出了組的類型。 – Yaniro 2011-12-30 16:52:39

+0

謝謝。我編輯了我的代碼以解釋多個組。我錯過了這部分問題。 – doogle 2011-12-30 16:59:45

+0

對不起,我仍然有點困惑..你的意思是使用問題[0]:「5)分號在Javascript聲明結束時是可選的。」, groups:instead? – query 2011-12-30 18:32:45