Necesito hacer que las preguntas junto con sus respuestas (opciones) se cargen de manera aleatoria.
Ya puse las preguntas con sus opciones, lo único que necesito hacer es que cada vez que recarge la página las preguntas junto con sus opciones se cambien de lugar de manera aleatoria y también que las preguntas no se repitan.
Ya intente varias cosas pero no se cómo lo podría hacer, vi que para poder hacerlo se utilizaba Math.random()
pero no tengo la menor idea de dónde ponerlo o qué hacer.
Este es mi código:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Evament JavaScript</title>
<link rel="stylesheet" type="text/css" href="css(cliente)/o.css">
<h1>Examen de JavaScript</h1>
<script>
var questions=[
{
quetion:"pregunta1",
choiceA:"res1a",
choiceB:"res2a",
choiceC:"res3a",
correct:"B",
},{
quetion:"pregunta2",
choiceA:"res1b",
choiceB:"res2",
choiceC:"res3b",
correct:"C",
},{
quetion:"pregunta3",
choiceA:"res1c",
choiceB:"res2c",
choiceC:"res3c",
correct:"A",
}
];
function startq(){
for (i=0;i<questions.length;i++){
document.getElementById("questions").innerHTML+='<form id="quetion">';
document.forms[i].innerHTML+=(i+1)+'.-'+questions[i].quetion;
document.forms[i].innerHTML+='<label>'+questions[i].choiceA+'<input type="radio" value="A" name="p'+i+'"><span></span></label>';
document.forms[i].innerHTML+='<label>'+questions[i].choiceB+'<input type="radio" value="B" name="p'+i+'"><span></span></label>';
document.forms[i].innerHTML+='<label>'+questions[i].choiceC+'<input type="radio" value="C" name="p'+i+'"><span></span></label>';
document.getElementById("questions").innerHTML+="</form><br><br>"
}
document.getElementById("questions").innerHTML+='<button onclick="result()">Evaluar</button>';
}
function result(){
var aciertos=0;
var x;
var puntaje=10/3;
var calificacion=0;
for(i=0;i< document.forms.length;i++){
x=document.forms[i];
console.log(x);
for(j=0;j<x.length;j++){
if (x[j].checked) {
console.log(x[j].value);
if (x[j].value==questions[i].correct) {
aciertos+=1;
calificacion=calificacion+puntaje;
}
}
}
}
console.log("Numero de aciertos:"+ aciertos);
console.log("Tu calificacion es: "+calificacion);
}
</script>
</head>
<body>
<button onclick="startq()">Iniciar</button>
<div id="questions">
</div>
</body>
</html>