mar774
Messages postés29Date d'inscriptionmercredi 27 août 2014StatutMembreDernière intervention17 mars 2024
-
Modifié le 21 mars 2024 à 14:26
mariam-j
Messages postés1393Date d'inscriptionmercredi 9 mars 2022StatutMembreDernière intervention22 décembre 2024
-
17 mars 2024 à 10:26
const quiz = [{
q: innerHTML ="<div>Le poids est une autre désignation de la masse</div>",
options:['Vrai','Faux'],
answer:1
},
{
q: innerHTML ="<div>La balance est un instrument de mesure du poids</div>",
options:['Vrai','Faux'],
answer:1
},
{
q: innerHTML ="<div>Le poids d’un corps s’exprime en kilogramme (kg)</div>",
options:['Vrai','Faux'],
answer:1
},
{
q: innerHTML ="<div>La masse d’un corps ne varie pas d’un lieu à un autre</div>",
options:['Vrai','Faux'],
answer:0
},
{
q: innerHTML ="<div>Le poids d’un corps s’exprime en Newton (N)</div>",
options:['Vrai','Faux'],
answer:0
},
{
q: innerHTML ="<div>La masse volumique d’un corps s’exprime en kilogramme par mètre cube Kg/<var>m<sup>3</sup></var></div>",
options:['Vrai','Faux'],
answer:0
},
]
const questionNumber = document.querySelector(".question-number");
const questionText = document.querySelector(".question-text");
const optionContainer = document.querySelector(".option-container");
const answerIndicatorContainer = document.querySelector(".answers-indicator");
let questionCounter = 0;
let currentQuestion;
let availableQuestions = [];
let availableOptions = [];
//push the question
function setAvailableQuestions(){
const totalQuestion = quiz.length;
for(let i=0; i<totalQuestion; i++){
availableQuestions.push(quiz[i])
}
}
//set question number and question
function getNewQuestion(){
//set question number
questionNumber.innerHTML = "Question " + (questionCounter+1) + " sur " + quiz.length;
//set quastion text
//get random question
const questionIndex = availableQuestions[Math.floor(Math.random() * availableQuestions.length)]
currentQuestion = questionIndex;
questionText.innerHTML = currentQuestion.q;
//get the position of questionindex from the availablequestion array:
const index1= availableQuestions.indexOf(questionIndex);
//remove the questionindex from the availablequestion array
availableQuestions.splice(index1,1);
//set options
//get the length of options
const optionLen = currentQuestion.options.length
//push options into availableOptions array
for(let i=0; i<optionLen; i++){
availableOptions.push(i)
}
optionContainer.innerHTML = '';
let animationDelay = 0.15;
//create options in html
for(let i=0; i<optionLen; i++){
//random option
const optonIndex = availableOptions[Math.floor(Math.random() * availableOptions.length)];
//get the postion of optionIdex from the availableOptions
const index2 = availableOptions.indexOf(optonIndex);
//remove the optionIdex from the availableOptions
availableOptions.splice(index2,1);
const option = document.createElement("div");
option.innerHTML = currentQuestion.options[optonIndex];
option.id = optonIndex;
option.style.animationDelay = animationDelay + "s";
animationDelay = animationDelay + 0.15;
option.className = "option";
optionContainer.appendChild(option)
option.setAttribute("onclick", "getResult(this)");
}
questionCounter++
}
//get the result of current attempt
function getResult(element){
const id = parseInt(element.id);
//get the answerby comparing the id of licked option
if(id === currentQuestion.answer){
//st the green collor to the correct option
element.classList.add("correct");
//add the indicator to mark
updateAnswerIndicator("correct")
}
else{
element.classList.add("wrong");
//add the indicator to mark
updateAnswerIndicator("wrong");
//if the answer is incorrect the show the correct option by adding green color the correct
const optionLen = optionContainer.children.length;
for(let i=0; i<optionLen; i++){
if(parseInt(optionContainer.children[i].id)===currentQuestion.answer){
optionContainer.children[i].classList.add("correct");
}
}
}
unclickableOptions();
}
//make all the questions unclickable once the user select a option (restriction)
function unclickableOptions(){
const optionLen= optionContainer.children.length;
for(let i=0; i<optionLen; i++){
optionContainer.children[i].classList.add("already-answered");
}
}
function answersIndicator(){
const totalQuestion = quiz.length;
for(let i=0; i<totalQuestion; i++){
const indicator = document.createElement("div");
answerIndicatorContainer.appendChild(indicator);
}
}
function updateAnswerIndicator(markType){
answerIndicatorContainer.children[questionCounter-1].classList.add(markType)
}
function next(){
if(questionCounter ===quiz.length){
console.log("quiz over");
}
else{
getNewQuestion();
}
}
window.onload = function(){
//first we will set all questions in availableQuestions array
setAvailableQuestions();
//second we will call GetnewQuestions(): function
getNewQuestion();
//to create indicator of answer
answersIndicator();
}
Bonjour, Monsieur ou Madame, j'ai un souci avec script que j'ai sur le net. dans partie : function getNewquestion, précisément Get random question. comment faire pour ne pas que les questions obéissent a la fonction random ? aidez moi par des ligne de code je veux enlever cette commande random
jordane45
Messages postés38346Date d'inscriptionmercredi 22 octobre 2003StatutModérateurDernière intervention16 décembre 20244 718 17 mars 2024 à 01:52
Bonjour,
1 - J'ai déplacé ta question dans le bon forum
2 - La ligne qui choisi une question de façon aléatoire est la ligne 62
sauf ton respect, commenter devrait être le résultat d'une réflexion, par exemple:
{
q: innerHTML ="<div>Le poids est une autre désignation de la masse</div>",
options:['Vrai','Faux'],
answer:1
},
les options proposées à cette question sont vrai et faux, dans un tableau et la réponse attendue est l'index 1 du tableau. Donc faux.....
Et du coup, ton commentaire est hors propos
mariam-j
Messages postés1393Date d'inscriptionmercredi 9 mars 2022StatutMembreDernière intervention22 décembre 202415
>
Utilisateur anonyme
17 mars 2024 à 10:26