我正在构建一个简单的测验,其中使用radio
输入来询问10个问题。您可以获得的最高分数是10。每个错误的答案是-0.5p,您可以选择“我不想回答这个问题”,选择不回答。
我正在努力计算总分,因为每个正确/不正确/不适用答案都有很多if
,所以我想创建一个数组:var CorrectAnswers=["Question 1","Question 2",...]
并应用诸如例如:if("CorrectAnswers[0]==true])mark=mark+1;
。
但是if
的列表太长。
有什么方法可以简化此过程,并告诉程序检查哪个答案正确/不正确/不适用,并在标记上添加1 / -0.5 / 0吗?
它不是英语,但希望您能理解。
//P1-2, P2-2, P3-3, P4-2, P5-4, P6-3, P7-4, P8-3, P9-2, P10-2
function calcul(){
//Respostes correctes
var p1c=document.getElementById("p1r2").checked;
var p2c=document.getElementById("p2r2").checked;
var p3c=document.getElementById("p3r3").checked;
var p4c=document.getElementById("p4r2").checked;
var p5c=document.getElementById("p5r4").checked;
var p6c=document.getElementById("p6r3").checked;
var p7c=document.getElementById("p7r4").checked;
var p8c=document.getElementById("p8r3").checked;
var p9c=document.getElementById("p9r2").checked;
var p10c=document.getElementById("p10r2").checked;
var RespostesCorrectes=[p1c,p2c,p3c,p4c,p5c,p6c,p7c,p8c,p9c,p10c];
//No contestades
var p1n=document.getElementById("p1r0").checked;
var p2n=document.getElementById("p2r0").checked;
var p3n=document.getElementById("p3r0").checked;
var p4n=document.getElementById("p4r0").checked;
var p5n=document.getElementById("p5r0").checked;
var p6n=document.getElementById("p6r0").checked;
var p7n=document.getElementById("p7r0").checked;
var p8n=document.getElementById("p8r0").checked;
var p9n=document.getElementById("p9r0").checked;
var p10n=document.getElementById("p10r0").checked;
var RespostesNA=[p1n,p2n,p3n,p4n,p5n,p6n,p7n,p8n,p9n,p10n];
//Calcular nota i pregs correctes/incorrectes
nota=0;
if(p1c==true)nota=nota+1;
if(p2c==true)nota=nota+1;
if(p3c==true)nota=nota+1;
if(p4c==true)nota=nota+1;
if(p5c==true)nota=nota+1;
if(p6c==true)nota=nota+1;
if(p7c==true)nota=nota+1;
if(p8c==true)nota=nota+1;
if(p9c==true)nota=nota+1;
if(p10c==true)nota=nota+1;
}
.codiPrograma{
font-family:"Courier", Courier, sans-serif;
font-size: 17px;
}
.codi{
font-family:"Courier", Courier, sans-serif;
font-size: 15px;
}
.boto{
width:150px;
height:30px;
font-size:15px;
margin:0 auto;
display: block;
}
#test{
/*display:none;*/
width:1000px;
margin: 0 auto;
}
#resultats{
width: 250px;
height:400px;
border: 5px solid black;
padding: 25px;
margin: 0 auto;
margin-top:30px;
display:none;
}
<div id="test">
<fieldset class="pregunta">
<legend>Pregunta 1</legend>
<h3>Quin és el valor de l'expressió següent? <br>
<span class="codiPrograma"><p> "23"+12</p></span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta1" id="p1r1">
<label class="codi" for="p1r1">35</label><br>
<input type="radio" name="pregunta1" id="p1r2">
<label class="codi" for="p1r2">"2312"</label><br>
<input type="radio" name="pregunta1" id="p1r3">
<label class="codi" for="p1r3">"35"</label><br>
<input type="radio" name="pregunta1" id="p1r4">
<label for="p1r4">No es pot avaluar perquè és sintàcticament incorrecte.</label><br>
<input type="radio" name="pregunta1" id="p1r0">
<label for="p1r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 2</legend>
<h3>Quin és el valor de l'expressió següent? <br>
<span class="codiPrograma"><p>"23">12 && !(parseInt("12px")<13)</p></span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta2" id="p2r1">
<label class="codi" for="p2r1">true</label><br>
<input type="radio" name="pregunta2" id="p2r2">
<label class="codi" for="p2r2">false</label><br>
<input type="radio" name="pregunta2" id="p2r3">
<label class="codi" for="p2r3">undefined</label><br>
<input type="radio" name="pregunta2" id="p2r4">
<label for="p2r4">No es pot avaluar perquè és sintàcticament incorrecte.</label><br>
<input type="radio" name="pregunta2" id="p2r0">
<label for="p2r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 3</legend>
<h3>Quina és la condició per saber que el valor de la variable x és un número parell i no múltiple de 3?</h3>
<div class="respostes">
<input type="radio" name="pregunta3" id="p3r1">
<label class="codi" for="p3r1">x%2==0 && !x%3==0</label><br>
<input type="radio" name="pregunta3" id="p3r2">
<label class="codi" for="p3r2">x/2=0 && !(x/3=0)</label><br>
<input type="radio" name="pregunta3" id="p3r3">
<label class="codi" for="p3r3">x%2==0 && !(x%3==0)</label><br>
<input type="radio" name="pregunta3" id="p3r4">
<label class="codi" for="p3r4">x%2=0 && !(x%3=0)</label><br>
<input type="radio" name="pregunta3" id="p3r0">
<label for="p3r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 4</legend>
<h3>Quina és la instrucció adequada per llegir el valor entrat per l'usuari a través del següent element HTML? <br>
<span class="codiPrograma"><p><input type="text" id="a"></p></span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta4" id="p4r1">
<label class="codi" for="p4r1">var x = document.getElementById('a').value;</label><br>
<input type="radio" name="pregunta4" id="p4r2">
<label class="codi" for="p4r2">var a = document.getElementById("a").value;</label><br>
<input type="radio" name="pregunta4" id="p4r3">
<label class="codi" for="p4r3">var a = document.getElementById("a").value();</label><br>
<input type="radio" name="pregunta4" id="p4r4">
<label for="p4r4">No es pot llegir perquè falta l'atribut size en l'element HTML</label><br>
<input type="radio" name="pregunta4" id="p4r0">
<label for="p4r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 5</legend>
<h3>Quin és el resultat d'executar la següent funció? <br>
<span class="codiPrograma"><p>function pregunta5(){</br> const A=5, B=10;</br> return B%2 - A*B/2;<br>}</p></span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta5" id="p5r1">
<label class="codi" for="p5r1">25</label><br>
<input type="radio" name="pregunta5" id="p5r2">
<label class="codi" for="p5r2">-20</label><br>
<input type="radio" name="pregunta5" id="p5r3">
<label for="p5r3">No es pot executar perquè té errors sintàctics</label><br>
<input type="radio" name="pregunta5" id="p5r4">
<label class="codi" for="p5r4">-25</label><br>
<input type="radio" name="pregunta5" id="p5r0">
<label for="p5r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 6</legend>
<h3>Quin és el resultat d'executar la funció programa()?<br>
<span class="codiPrograma"><p>function programa(){<br> var x=2, y=5;<br> y=pregunta6(x,y);<br> alert("El resultat és " + x);<br>}<br>function pregunta6(x,y){<br> x=x+y;<br> return x;<br>}</p></span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta6" id="p6r1">
<label class="codi" for="p6r1">El resultat és 5</label><br>
<input type="radio" name="pregunta6" id="p6r2">
<label class="codi" for="p6r2">El resultat és 7</label><br>
<input type="radio" name="pregunta6" id="p6r3">
<label class="codi" for="p6r3">El resultat és 2</label><br>
<input type="radio" name="pregunta6" id="p6r4">
<label class="codi" for="p6r4">El resultat és 6</label><br>
<input type="radio" name="pregunta6" id="p6r0">
<label for="p6r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 7</legend>
<h3>Quina d'aquestes funcions NO calcula correctament la suma de tots els nombres imparells que hi ha entre 5 i 186, ambdós inclosos? <br>
<span class="codiPrograma"> <br>function funcioA() {<br> var resultat=0;<br> var i;<br> for (i=186; i>5; i--)<br> if(i%2==1) resultat=resultat+i;<br> return resultat;<br>}<br>function funcioB(){<br> var resultat=0;<br> var i;<br> for(i=5; i<=186; i++)<br> if(i%2==1) resultat=resultat+i;<br> return resultat;<br>}<br>function funcioC(){<br> var resultat=0;<br> var i;<br> for(i=5; i<=186; i=i+2)<br> resultat=resultat+i;<br> return resultat;<br>}<br>function funcioD(){<br> var resultat=0;<br> var i;<br> for(i=5; i<=186; i++)<br> if(i%2=1) resultat=resultat+i;<br> return resultat;<br>}</span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta7" id="p7r1">
<label class="codi" for="p7r1">funcioA</label><br>
<input type="radio" name="pregunta7" id="p7r2">
<label class="codi" for="p7r2">funcioB</label><br>
<input type="radio" name="pregunta7" id="p7r3">
<label class="codi" for="p7r3">funcioC</label><br>
<input type="radio" name="pregunta7" id="p7r4">
<label class="codi" for="p7r4">funcioD</label><br>
<input type="radio" name="pregunta7" id="p7r0">
<label for="p7r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 8</legend>
<h3>Donat l'objecte <span class="codiPrograma">var rectangle={posicio: {x:"3", y:"5"}, amplada:"10", alçada:"20"}</span> quina expressió calcula correctament l'àrea del mateix?
</h3>
<div class="respostes">
<input type="radio" name="pregunta8" id="p8r1">
<label class="codi" for="p8r1">amplada*alçada</label><br>
<input type="radio" name="pregunta8" id="p8r2">
<label class="codi" for="p8r2">amplada.rectangle*alçada.rectangle</label><br>
<input type="radio" name="pregunta8" id="p8r3">
<label class="codi" for="p8r3">rectangle.amplada*rectangle.alçada</label><br>
<input type="radio" name="pregunta8" id="p8r4">
<label class="codi" for="p8r4">parseInt("rectangle.amplada")*parseInt("rectangle.alçada")</label><br>
<input type="radio" name="pregunta8" id="p8r0">
<label for="p8r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 9</legend>
<h3>Amb el mateix rectangle de la pregunta anterior, quina instrucció el mouria a la nova posició<span class="codiPrograma"> x="7"</span> i <span class="codiPrograma">y="9"</span>?
</h3>
<div class="respostes">
<input type="radio" name="pregunta9" id="p9r1">
<label class="codi" for="p9r1">rectangle.posiciox="7"; rectangle.posicioy="9";</label><br>
<input type="radio" name="pregunta9" id="p9r2">
<label class="codi" for="p9r2">rectangle.posicio.y="9"; rectangle.posicio.x="7";</label><br>
<input type="radio" name="pregunta9" id="p9r3">
<label class="codi" for="p9r3">posicio.x="7"; posicio.y="9";</label><br>
<input type="radio" name="pregunta9" id="p9r4">
<label class="codi" for="p9r4">posicio.x="7" && posicio.y="9";</label><br>
<input type="radio" name="pregunta9" id="p9r0">
<label for="p9r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 10</legend>
<h3>Quina cadena de caràcters avalua la següent expressió? <br>
<span class="codiPrograma">"Hola. ".charAt(2)+"Que tal?".toLowerCase()</span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta10" id="p10r1">
<label class="codi" for="p10r1">"Hola. Que tal?"</label><br>
<input type="radio" name="pregunta10" id="p10r2">
<label class="codi" for="p10r2">"lque tal="</label><br>
<input type="radio" name="pregunta10" id="p10r3">
<label class="codi" for="p10r3">"oque tal??"</label><br>
<input type="radio" name="pregunta10" id="p10r4">
<label class="codi" for="p10r4">"hola. que tal?"</label><br>
<input type="radio" name="pregunta10" id="p10r0">
<label for="p10r0">No contesto</label><br>
</div>
</fieldset>
<br>
<button id="boto" class="boto" type="button" onClick="calcul()">Calcular Nota</button>
</div>
答案 0 :(得分:1)
正如我在评论中所暗示的那样,您可以使用for
循环。您已经在数组中获得了正确的答案和“ N / A”答案,因此可以轻松地遍历它们。伪代码将类似于:
score <- 0
for each question
if correct answer selected then
score <- score + 1
else if n/a answer not selected then
score <- score - 0.5
end
next question
将其翻译为javascript,您将得到以下内容:
var nota = 0;
for (var i = 0; i < RespostesCorrectes.length; i++) {
if (RespostesCorrectes[i]) {
nota += 1;
} else if (!RespostesNA[i]) {
nota -= 0.5;
}
}
最后,您需要向用户显示结果分数。对于这个简单的示例,alert
就足够了。
//P1-2, P2-2, P3-3, P4-2, P5-4, P6-3, P7-4, P8-3, P9-2, P10-2
function calcul(){
//Respostes correctes
var p1c=document.getElementById("p1r2").checked;
var p2c=document.getElementById("p2r2").checked;
var p3c=document.getElementById("p3r3").checked;
var p4c=document.getElementById("p4r2").checked;
var p5c=document.getElementById("p5r4").checked;
var p6c=document.getElementById("p6r3").checked;
var p7c=document.getElementById("p7r4").checked;
var p8c=document.getElementById("p8r3").checked;
var p9c=document.getElementById("p9r2").checked;
var p10c=document.getElementById("p10r2").checked;
var RespostesCorrectes=[p1c,p2c,p3c,p4c,p5c,p6c,p7c,p8c,p9c,p10c];
//No contestades
var p1n=document.getElementById("p1r0").checked;
var p2n=document.getElementById("p2r0").checked;
var p3n=document.getElementById("p3r0").checked;
var p4n=document.getElementById("p4r0").checked;
var p5n=document.getElementById("p5r0").checked;
var p6n=document.getElementById("p6r0").checked;
var p7n=document.getElementById("p7r0").checked;
var p8n=document.getElementById("p8r0").checked;
var p9n=document.getElementById("p9r0").checked;
var p10n=document.getElementById("p10r0").checked;
var RespostesNA=[p1n,p2n,p3n,p4n,p5n,p6n,p7n,p8n,p9n,p10n];
//Calcular nota i pregs correctes/incorrectes
var nota = 0;
for (var i = 0; i < RespostesCorrectes.length; i++) {
if (RespostesCorrectes[i]) {
nota += 1;
} else if (!RespostesNA[i]) {
nota -= 0.5;
}
}
alert(nota);
}
.codiPrograma{
font-family:"Courier", Courier, sans-serif;
font-size: 17px;
}
.codi{
font-family:"Courier", Courier, sans-serif;
font-size: 15px;
}
.boto{
width:150px;
height:30px;
font-size:15px;
margin:0 auto;
display: block;
}
#test{
/*display:none;*/
width:1000px;
margin: 0 auto;
}
#resultats{
width: 250px;
height:400px;
border: 5px solid black;
padding: 25px;
margin: 0 auto;
margin-top:30px;
display:none;
}
<div id="test">
<fieldset class="pregunta">
<legend>Pregunta 1</legend>
<h3>Quin és el valor de l'expressió següent? <br>
<span class="codiPrograma"><p> "23"+12</p></span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta1" id="p1r1">
<label class="codi" for="p1r1">35</label><br>
<input type="radio" name="pregunta1" id="p1r2">
<label class="codi" for="p1r2">"2312"</label><br>
<input type="radio" name="pregunta1" id="p1r3">
<label class="codi" for="p1r3">"35"</label><br>
<input type="radio" name="pregunta1" id="p1r4">
<label for="p1r4">No es pot avaluar perquè és sintàcticament incorrecte.</label><br>
<input type="radio" name="pregunta1" id="p1r0">
<label for="p1r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 2</legend>
<h3>Quin és el valor de l'expressió següent? <br>
<span class="codiPrograma"><p>"23">12 && !(parseInt("12px")<13)</p></span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta2" id="p2r1">
<label class="codi" for="p2r1">true</label><br>
<input type="radio" name="pregunta2" id="p2r2">
<label class="codi" for="p2r2">false</label><br>
<input type="radio" name="pregunta2" id="p2r3">
<label class="codi" for="p2r3">undefined</label><br>
<input type="radio" name="pregunta2" id="p2r4">
<label for="p2r4">No es pot avaluar perquè és sintàcticament incorrecte.</label><br>
<input type="radio" name="pregunta2" id="p2r0">
<label for="p2r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 3</legend>
<h3>Quina és la condició per saber que el valor de la variable x és un número parell i no múltiple de 3?</h3>
<div class="respostes">
<input type="radio" name="pregunta3" id="p3r1">
<label class="codi" for="p3r1">x%2==0 && !x%3==0</label><br>
<input type="radio" name="pregunta3" id="p3r2">
<label class="codi" for="p3r2">x/2=0 && !(x/3=0)</label><br>
<input type="radio" name="pregunta3" id="p3r3">
<label class="codi" for="p3r3">x%2==0 && !(x%3==0)</label><br>
<input type="radio" name="pregunta3" id="p3r4">
<label class="codi" for="p3r4">x%2=0 && !(x%3=0)</label><br>
<input type="radio" name="pregunta3" id="p3r0">
<label for="p3r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 4</legend>
<h3>Quina és la instrucció adequada per llegir el valor entrat per l'usuari a través del següent element HTML? <br>
<span class="codiPrograma"><p><input type="text" id="a"></p></span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta4" id="p4r1">
<label class="codi" for="p4r1">var x = document.getElementById('a').value;</label><br>
<input type="radio" name="pregunta4" id="p4r2">
<label class="codi" for="p4r2">var a = document.getElementById("a").value;</label><br>
<input type="radio" name="pregunta4" id="p4r3">
<label class="codi" for="p4r3">var a = document.getElementById("a").value();</label><br>
<input type="radio" name="pregunta4" id="p4r4">
<label for="p4r4">No es pot llegir perquè falta l'atribut size en l'element HTML</label><br>
<input type="radio" name="pregunta4" id="p4r0">
<label for="p4r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 5</legend>
<h3>Quin és el resultat d'executar la següent funció? <br>
<span class="codiPrograma"><p>function pregunta5(){</br> const A=5, B=10;</br> return B%2 - A*B/2;<br>}</p></span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta5" id="p5r1">
<label class="codi" for="p5r1">25</label><br>
<input type="radio" name="pregunta5" id="p5r2">
<label class="codi" for="p5r2">-20</label><br>
<input type="radio" name="pregunta5" id="p5r3">
<label for="p5r3">No es pot executar perquè té errors sintàctics</label><br>
<input type="radio" name="pregunta5" id="p5r4">
<label class="codi" for="p5r4">-25</label><br>
<input type="radio" name="pregunta5" id="p5r0">
<label for="p5r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 6</legend>
<h3>Quin és el resultat d'executar la funció programa()?<br>
<span class="codiPrograma"><p>function programa(){<br> var x=2, y=5;<br> y=pregunta6(x,y);<br> alert("El resultat és " + x);<br>}<br>function pregunta6(x,y){<br> x=x+y;<br> return x;<br>}</p></span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta6" id="p6r1">
<label class="codi" for="p6r1">El resultat és 5</label><br>
<input type="radio" name="pregunta6" id="p6r2">
<label class="codi" for="p6r2">El resultat és 7</label><br>
<input type="radio" name="pregunta6" id="p6r3">
<label class="codi" for="p6r3">El resultat és 2</label><br>
<input type="radio" name="pregunta6" id="p6r4">
<label class="codi" for="p6r4">El resultat és 6</label><br>
<input type="radio" name="pregunta6" id="p6r0">
<label for="p6r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 7</legend>
<h3>Quina d'aquestes funcions NO calcula correctament la suma de tots els nombres imparells que hi ha entre 5 i 186, ambdós inclosos? <br>
<span class="codiPrograma"> <br>function funcioA() {<br> var resultat=0;<br> var i;<br> for (i=186; i>5; i--)<br> if(i%2==1) resultat=resultat+i;<br> return resultat;<br>}<br>function funcioB(){<br> var resultat=0;<br> var i;<br> for(i=5; i<=186; i++)<br> if(i%2==1) resultat=resultat+i;<br> return resultat;<br>}<br>function funcioC(){<br> var resultat=0;<br> var i;<br> for(i=5; i<=186; i=i+2)<br> resultat=resultat+i;<br> return resultat;<br>}<br>function funcioD(){<br> var resultat=0;<br> var i;<br> for(i=5; i<=186; i++)<br> if(i%2=1) resultat=resultat+i;<br> return resultat;<br>}</span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta7" id="p7r1">
<label class="codi" for="p7r1">funcioA</label><br>
<input type="radio" name="pregunta7" id="p7r2">
<label class="codi" for="p7r2">funcioB</label><br>
<input type="radio" name="pregunta7" id="p7r3">
<label class="codi" for="p7r3">funcioC</label><br>
<input type="radio" name="pregunta7" id="p7r4">
<label class="codi" for="p7r4">funcioD</label><br>
<input type="radio" name="pregunta7" id="p7r0">
<label for="p7r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 8</legend>
<h3>Donat l'objecte <span class="codiPrograma">var rectangle={posicio: {x:"3", y:"5"}, amplada:"10", alçada:"20"}</span> quina expressió calcula correctament l'àrea del mateix?
</h3>
<div class="respostes">
<input type="radio" name="pregunta8" id="p8r1">
<label class="codi" for="p8r1">amplada*alçada</label><br>
<input type="radio" name="pregunta8" id="p8r2">
<label class="codi" for="p8r2">amplada.rectangle*alçada.rectangle</label><br>
<input type="radio" name="pregunta8" id="p8r3">
<label class="codi" for="p8r3">rectangle.amplada*rectangle.alçada</label><br>
<input type="radio" name="pregunta8" id="p8r4">
<label class="codi" for="p8r4">parseInt("rectangle.amplada")*parseInt("rectangle.alçada")</label><br>
<input type="radio" name="pregunta8" id="p8r0">
<label for="p8r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 9</legend>
<h3>Amb el mateix rectangle de la pregunta anterior, quina instrucció el mouria a la nova posició<span class="codiPrograma"> x="7"</span> i <span class="codiPrograma">y="9"</span>?
</h3>
<div class="respostes">
<input type="radio" name="pregunta9" id="p9r1">
<label class="codi" for="p9r1">rectangle.posiciox="7"; rectangle.posicioy="9";</label><br>
<input type="radio" name="pregunta9" id="p9r2">
<label class="codi" for="p9r2">rectangle.posicio.y="9"; rectangle.posicio.x="7";</label><br>
<input type="radio" name="pregunta9" id="p9r3">
<label class="codi" for="p9r3">posicio.x="7"; posicio.y="9";</label><br>
<input type="radio" name="pregunta9" id="p9r4">
<label class="codi" for="p9r4">posicio.x="7" && posicio.y="9";</label><br>
<input type="radio" name="pregunta9" id="p9r0">
<label for="p9r0">No contesto</label><br>
</div>
</fieldset>
<fieldset class="pregunta">
<legend>Pregunta 10</legend>
<h3>Quina cadena de caràcters avalua la següent expressió? <br>
<span class="codiPrograma">"Hola. ".charAt(2)+"Que tal?".toLowerCase()</span>
</h3>
<div class="respostes">
<input type="radio" name="pregunta10" id="p10r1">
<label class="codi" for="p10r1">"Hola. Que tal?"</label><br>
<input type="radio" name="pregunta10" id="p10r2">
<label class="codi" for="p10r2">"lque tal="</label><br>
<input type="radio" name="pregunta10" id="p10r3">
<label class="codi" for="p10r3">"oque tal??"</label><br>
<input type="radio" name="pregunta10" id="p10r4">
<label class="codi" for="p10r4">"hola. que tal?"</label><br>
<input type="radio" name="pregunta10" id="p10r0">
<label for="p10r0">No contesto</label><br>
</div>
</fieldset>
<br>
<button id="boto" class="boto" type="button" onClick="calcul()">Calcular Nota</button>
</div>
一旦您对循环感到满意,还有很多其他方法可以进一步改善这一点。我鼓励您查看多次重复几乎相同代码的地方,看看是否可以将其简化为一个简单的循环。
答案 1 :(得分:0)
我强烈建议您使用JQuery,然后您可以使用类似的方法来检查用户篷车
var awnsers = {1,2,4,2...} //Correct awnsers
var userAwnsers = {}
$(".pregunta").each((i, elm)=>{
$.each(elm,(i,r)=>{
if(r.checked)
{
userAwnser.push(i);
}
})
})
或使用普通JS
var awnsers = {1,2,4,2...} //Correct awnsers
var userAwnsers = {}
var questions = document.querySelectorAll(".pregunta");
questions.forEach((elm)=>{
var userq = elm.querySelectorAll("[type='ratio']");
userq.forEach((e,i)=>{
if(e.checked) userAwnser.push(i)
})
});
});
最后,您可以将awnser数组与userAwnser进行比较,以检查用户是否获得了分数
var score = 0;
awnsers.forEach((e,i)=> if(e == userAwnsers[i]) score++)
如果您不知道()=>{}
只是function(){}
的简写,并且在编写内联函数(例如最后一个forEach
循环)时,则不必使用方括号,其中包括if语句
答案 2 :(得分:0)
您需要使用这些单选按钮的值。
<input type="radio" name="pregunta1" id="p1r1" value="-0.5">
<input type="radio" name="pregunta1" id="p1r2" value="1">
<!-- continue adding the correct values! -->
然后您的功能就变得简单了
function calcul(){
var val1 = parseFloat(getRadioVal("pregunta1"));
var val2 = parseFloat(getRadioVal("pregunta2"));
//etc
result = val1 + val2; // +val3, etc
}
//UPDATE added this function to avoid querySelector
function getRadioVal(name) {
var val;
// get list of radio buttons with specified name
var radios = document.getElementsByName(name);
// loop through list of radio buttons
for (var i=0, len=radios.length; i<len; i++) {
if ( radios[i].checked ) { // radio checked?
val = radios[i].value; // if so, hold its value in val
break; // and break out of for loop
}
}
return val; // return value of checked radio or undefined if none checked
}