2014-12-03 28 views
0
<!doctype html public "-//w3c//dtd html 4.0 transitional//en"> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; 
charset=iso-8859-1"> 
    <meta name="GENERATOR" content="Mozilla/4.51 (Macintosh; I; PPC) 
[Netscape]"> 
    <title>Correcting cloze exercise</title> 
<script LANGUAGE="javascript"> 
function Gradeit() 
{ 

function getvalues(){ 

return document.quiz.q1.value 
return document.quiz.q2.value 
return document.quiz.q3.value 
return document.quiz.q4.value 
return document.quiz.q5.value 
return document.quiz.q6.value 
return document.quiz.q7.value 
return document.quiz.q8.value 
return document.quiz.q9.value 
return document.quiz.q10.value 
} 




var Answers=new Array(10) 
Answers[0]="Rawls" 
Answers[1]="Utilitarianism" 
Answers[2]="Deontological" 
Answers[3]="Socialist" 
Answers[4]="Contractual" 
Answers[5]="Veil of Ignorance" 
Answers[6]="Stage 2" 
Answers[7]="Intent based Utilitarianism" 
Answers[8]="Libertarian Justice" 
Answers[9]="Kant" 


var UserAnswers = new Array(10) 
UserAnswers[0] = document.quiz.q1.value 
UserAnswers[1] = document.quiz.q2.value 
UserAnswers[2] = document.quiz.q3.value 
UserAnswers[3] = document.quiz.q4.value 
UserAnswers[4] = document.quiz.q5.value 
UserAnswers[5] = document.quiz.q6.value 
UserAnswers[6] = document.quiz.q7.value 
UserAnswers[7] = document.quiz.q8.value 
UserAnswers[8] = document.quiz.q9.value 
UserAnswers[9] = document.quiz.q10.value 


var count0 = 0 
document.quiz.number_correct.value = 0 


if (Answers[0] == UserAnswers[0]) 
{count0 = count0 + 1, document.quiz.ebox1.value=""} 
else 
{count0 = count0, document.quiz.ebox1.value="X"} 

if (Answers[1] == UserAnswers[1]) 
{count0 = count0 + 1, document.quiz.ebox2.value=" "} 
else 
{count0 = count0, document.quiz.ebox2.value="X"} 

if (Answers[2] == UserAnswers[2]) 
{count0 = count0 + 1, document.quiz.ebox3.value=" "} 
else 
{count0 = count0, document.quiz.ebox3.value="X"} 

if (Answers[3] == UserAnswers[3]) 
{count0 = count0 + 1, document.quiz.ebox4.value=" "} 
else 
{count0 = count0, document.quiz.ebox4.value="X"} 

if (Answers[4] == UserAnswers[4]) 
{count0 = count0 + 1, document.quiz.ebox5.value=" "} 
else 
{count0 = count0, document.quiz.ebox5.value="X"} 

if (Answers[5] == UserAnswers[5]) 
{count0 = count0 + 1, document.quiz.ebox6.value=" "} 
else 
{count0 = count0, document.quiz.ebox6.value="X"} 

if (Answers[6] == UserAnswers[6]) 
{count0 = count0 + 1, document.quiz.ebox7.value=" "} 
else 
{count0 = count0, document.quiz.ebox7.value="X"} 

if (Answers[7] == UserAnswers[7]) 
{count0 = count0 + 1, document.quiz.ebox8.value=" "} 
else 
{count0 = count0, document.quiz.ebox8.value="X"} 

if (Answers[8] == UserAnswers[8]) 
{count0 = count0 + 1, document.quiz.ebox9.value=" "} 
else 
{count0 = count0, document.quiz.ebox9.value="X"} 

if (Answers[9] == UserAnswers[9]) 
{count0 = count0 + 1, document.quiz.ebox10.value=" "} 
else 
{count0 = count0, document.quiz.ebox10.value="X"} 

document.quiz.number_correct.value = count0 


} 

</script> 
</head> 
<body> 

<h1> 
Self-Correcting and Grading Fill-ins</h1> 

<p>Directions.&nbsp; Fill in the blanks in the sentences below with the 
appropriate vocabulary words from the box below.&nbsp; Note there are 
five 
extra words.&nbsp; After filling it in, click the "Grade it" button. The button "Get answer key" opens a new 
window, 
where all the answers are listed. 
<br>&nbsp; 
<center><table COLS=3 WIDTH="75%" > 
<tr> 
<td>Principle of Equal Liberty Rights</td> 

<td>Intent based Utilitarianism</td> 

<td>Capitalist</td> 
</tr> 

<tr> 
<td>Stage 2</td> 

<td>Contractual</td> 

<td>Rawls</td> 
</tr> 

<tr> 
<td>Deontological</td> 

<td>Legal</td> 

<td>Universalizable</td> 
</tr> 

<tr> 
<td>Veil of Ignorance</td> 

<td>Utilitarianism</td> 

<td>Libertarian Justice</td> 
</tr> 

<tr> 
<td>Stage 3</td> 

<td>Kant</td> 

<td>Socialist</td> </tr> 


<td>&nbsp;</td> 
</tr> 
</table></center> 

<p><form NAME="quiz"><input name="ebox1" type="text" size="1"><b>#1: Which writer was a major proponent of the theory of Justice as Fairness?</b><input name="q1" type="text" size="25"> 

<p><input name="ebox2" type="text" size="1"><b>#2: A decision focused on outcome or consequences that emphasizes the greatest good for the greatest number&nbsp;</b><input name="q2" type="text" size="25"> 

<p><input name="ebox3" type="text" size="1"><b>#3: An approach that focuses on 「universal ethical principles」 

&nbsp;<input name="q3" type="text" size="25"></b> 

<p><input name="ebox4" type="text" size="1"><b>#4: Which justice is criticised for providing a disincentive to contribute, since we’ll all get the same benefits no matter what (free rider problem)? 
&nbsp;<input 
name="q4" type="text" size="25"></b> 

<p><input name="ebox5" type="text" size="1"><b>#5 Limited rights and duties that arise when individuals enter into agreements with one another. 
<input 
name="q5" type="text" size="25"></b> 

<p><input name="ebox6" type="text" size="1"><b>#6 The point of this is to remove personal bias from the choice of principles. 
    &nbsp;<input name="q6" type="text" size="25"></b> 

<p><input name="ebox7" type="text" size="1"><b>#7 Reason for doing the right thing is to gain rewards (i.e., right actions are 「instruments」 for satisfying one’s own needs) is which stage of the Moral Cognitive Development Model? 
<input 
name="q7" type="text" size="25"></b> 

<p><input name="ebox8" type="text" size="1"><b>#8 If you genuinely tried your best to maximize utility, you’ve done the right thing, even if it turns out in the end that utility wasn’t maximized is 
&nbsp;<input name="q8" type="text" size="25"></b> 

<p><input name="ebox9" type="text" size="1"><b>#9:The people who have them, earn them, or are freely given them describes which justice? 
<input 
name="q9" type="text" size="25"></b> 

<p><input name="ebox10" type="text" size="1"><b>#10: Reversible, universalizable 
and treating stakeholders as an end unto themselves and does not use them only as a means to an end is part of which theory? 
<input name="q10" type="text" size="25"></b> 

<p><input TYPE="button" VALUE="Grade Me" onClick="Gradeit()"><input 
type="reset" Value="Clear All Answers"><br> 

<b>You got&nbsp;<input name="number_correct" type="text" 
size="4">correct out of 10. Try questions marked with the "X" again, and click the button to have your answers checked again.</b> 
</form> 
</body> enter code here 
</html> 

除了讓用戶的答案不區分大小寫,關於如何在用戶有正確答案時放置綠色勾號標記的任何想法?目前,如果用戶是正確的,它是空白的。所以我需要一些顯示正確答案的綠色勾號和錯誤答案的紅色十字。如何讓用戶回答不區分大小寫的問題?

回答

1

我的Javascript,你可以將任何字符串

"string".toLowerCase() 

或者在一個變量的情況下,爲小寫:

variable.toLowerCase() 

這種方法使得它更容易做比較,因爲這些字母將成爲全部小寫。我希望這就是你所問的。綠色勾號標記,因爲您也想知道如何解決從文檔對象模型中添加/刪除內容的問題。一種方法是顯示圖像,然後根據答案將圖像來源更改爲檢查或「x」標記。例如:

if(true) { //if the answer is correct 
    document.getElementById('image').src = 'check.png'; 
} else { 
    document.getElementById('image').src = 'wrong.png'; 
} 
+0

如何將此代碼合併到我的代碼中? – Jason 2014-12-03 23:02:20

0

要合併Gwiddle的答案,無論你希望它是你需要有一個形象的每個答案旁邊,它。然而,你應該開始給它沒有源,並給它「markbox0」或類似的ID

<img src="" id="markbox0" alt="mark"> 

現在,您將能夠更改代碼的圖像拉斯特的源如圖Gwiddle使用

document.getElementById('markbox').src = 'check.png'; 

此外,作爲一般的編碼提示,如果你的項目的長列表進行一組類似的代碼,它往往是更容易使用一個循環,而不是寫出來的每一個。如果你想在你的頁面添加更多的問題,這將特別有用。一個簡單的'for'循環將節省大量的空間和寫作。在這裏,你使用一個變量來計算每次循環代碼的運行時間,讓你能夠瀏覽一長串的東西。例如,你的回答校驗碼可以用以下方式實現:

for (var i = 0; i <= Answers.length; i = i + 1){ 
    if (Answers[i] == UserAnswers[i]) 
     {count0 = count0 + 1; 
     document.getElementById('markbox' + String(i)).src = 'check.png';} 
    else 
     {count0 = count0; 
     document.getElementById('markbox' + String(i)).src = 'cross.png';} 
} 

這個循環與運行中有你的答案列表中的項目「我」爲號,次數的代碼。我的值從0開始,每次循環運行時增加1。第一次,它會將Answers [0]與UserAnswers [0]進行比較,並確定圖像的來源,其中id爲'markbox0',然後再次用1,依此類推。

希望能幫到你。