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

【问题标题】：How do I make the users answers to the questions not case sensitive?如何让用户回答的问题不区分大小写？
【发布时间】：2015-02-01 16:35:19
【问题描述】：

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

除了让用户的答案不区分大小写之外，关于如何在用户有正确答案时打上绿色刻度线的任何想法？当前，如果用户正确，则为空白。所以我需要一个绿色勾号表示正确答案和红色叉号表示错误答案的东西。

【问题讨论】：

标签： html xcode symbols case-sensitive

【解决方案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';
}

【讨论】：

【解决方案2】：

要合并 Gwiddle 的答案，您需要在每个答案旁边放一张图片，无论您想要它在哪里。但是，您应该最初不给它来源，并给它一个“markbox0”或类似的ID

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

您现在可以使用 Gwiddle 更改代码中图像 laster 的来源

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

此循环以“i”为数字运行代码，次数为您的答案列表中有项目的次数。 i 的值从 0 开始，每次循环运行时增加 1。第一次，它会比较 Answers[0] 和 UserAnswers[0] 并确定 id 为 'markbox0' 的图像的来源，然后再次使用 1，依此类推。

希望对你有所帮助。

【讨论】：