如何让用户回答不区分大小写的问题?

时间:2014-12-03 22:49:06

标签: html xcode symbols case-sensitive

<!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> 

除了让用户的答案不区分大小写外,还有任何关于如何在用户有正确答案时设置绿色勾号的想法吗?目前,如果用户是对的,则为空白。所以我需要一些东西显示正确答案的绿色刻度线和红叉表示错误答案。

2 个答案:

答案 0 :(得分:1)

我可以使用

将任何字符串转换为小写
"string".toLowerCase()

或者在变量的情况下:

variable.toLowerCase()

这种方法可以更容易地进行比较,因为字母将全部小写。我希望你问的是什么。绿色刻度标记,因为您还想知道在文档对象模型中添加/删除内容的决心。一种方法是显示图像,然后将图像的来源更改为支票或&#34; x&#34;基于答案标记。例如:

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

答案 1 :(得分:0)

要合并Gwiddle的答案,你需要在每个答案旁边都有一张图片,无论你想要它在哪里。但是,您最初应该不给它任何来源,并给它一个ID为&#34; markbox0&#34;或类似的

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

您现在可以使用

更改代码中图像laster的来源,如Gwiddle所示
 document.getElementById('markbox').src = 'check.png';

此外,作为一般编码提示,如果您为一长串项目执行类似的代码集,则使用循环通常要容易得多,而不是写出每一个循环。如果您想向页面添加更多问题,这将特别有用。一个简单的&#39; for&#39;循环将节省大量空间和写作。在这里,您使用一个变量,该变量在每次循环代码运行时计数,允许您逐步查看一长串事物。例如,您的答案检查代码可以通过以下方式实现:

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';}
}

此循环使用&#39; i&#39;运行代码。作为数字,表示答案列表中有项目的次数。 i的值从0开始,每次循环运行时增加1。第一次,它会将Answers [0]与UserAnswers [0]进行比较,并使用id&#39; markbox0&#39;确定图像的来源,然后再用1确定,依此类推。

希望对你有所帮助。