Buongiorno.
Vorrei creare un Quiz in Javascript ed assegnare un punteggio specifico a ogni singola domanda corretta.
Dovrei modificare il codice a seguire, che assegna 1 punto (this.score++
ad ogni domanda corretta:
e magari bisogna aggiungere altro codice?
grazie per un cortese aiuto.
Vorrei creare un Quiz in Javascript ed assegnare un punteggio specifico a ogni singola domanda corretta.
Dovrei modificare il codice a seguire, che assegna 1 punto (this.score++
ad ogni domanda corretta:
Codice:
// inizio HTML ----------
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Quiz</title>
<!-- link rel="stylesheet" type="text/css" href="style.css" -->
</head>
<body>
<div class="grid">
<div id="quiz">
<h1>Quiz Geografia</h1>
<hr style="margin-bottom: 20px">
<p id="question"></p>
<div class="buttons">
<button id="btn0"><span id="choice0"></span></button>
<button id="btn1"><span id="choice1"></span></button>
<button id="btn2"><span id="choice2"></span></button>
<button id="btn3"><span id="choice3"></span></button>
</div>
<hr style="margin-top: 50px">
<footer>
<p id="progress">Question x of y</p>
<center><p>Javascript Quiz</p></center>
</footer>
</div>
</div>
<script src="question.js"></script>
</body>
</html>
// fine HTML ---------
e lo scrip :
// inizio Javascript "question.js" --------
function Quiz(questions) {
this.score = 0;
this.questions = questions;
this.questionIndex = 0;
}
Quiz.prototype.getQuestionIndex = function() {
return this.questions[this.questionIndex];
}
Quiz.prototype.guess = function(answer) {
if(this.getQuestionIndex().isCorrectAnswer(answer)) {
this.score++;
}
this.questionIndex++;
}
Quiz.prototype.isEnded = function() {
return this.questionIndex === this.questions.length;
}
function Question(text, choices, answer) {
this.text = text;
this.choices = choices;
this.answer = answer;
}
Question.prototype.isCorrectAnswer = function(choice) {
return this.answer === choice;
}
function populate() {
if(quiz.isEnded()) {
showScores();
}
else {
// show question
var element = document.getElementById("question");
element.innerHTML = quiz.getQuestionIndex().text;
// show options
var choices = quiz.getQuestionIndex().choices;
for(var i = 0; i < choices.length; i++) {
var element = document.getElementById("choice" + i);
element.innerHTML = choices;
guess("btn" + i, choices);
}
showProgress();
}
};
function guess(id, guess) {
var button = document.getElementById(id);
button.onclick = function() {
quiz.guess(guess);
populate();
}
};
function showProgress() {
var currentQuestionNumber = quiz.questionIndex + 1;
var element = document.getElementById("progress");
element.innerHTML = "Domanda " + currentQuestionNumber + " di " + quiz.questions.length;
};
function showScores() {
var gameOverHTML = "<h1>Risultato</h1>";
gameOverHTML += "<h2 id='score'>Punteggio totale: " + quiz.score + "</h2>";
var element = document.getElementById("quiz");
element.innerHTML = gameOverHTML;
};
// crea domande
var questions = [
new Question("Fiume piu' lungo?", ["Adige", "Tevere","Po", "Arno"], "Po"),
new Question("Monte piu' alto?", ["Cervino", "Bianco", "Rosa", "Pollino"], "Bianco"),
new Question("Capitale Italia", ["Milano", "Roma", "Palermo", "Venezia"], "Roma")
];
// crea quiz
var quiz = new Quiz(questions);
// visualizza quiz
populate();
// fine Javascript --------
avevo pensato di modificare le domande come segue :
new Question("Fiume piu' lungo?", ["Adige", "Tevere","Po", "Arno"], "Po", 1), // 1 punto
new Question("Monte piu' alto?", ["Cervino", "Bianco", "Rosa", "Pollino"], "Bianco", 2), // 2 punti
new Question("Capitale Italia", ["Milano", "Roma", "Palermo", "Venezia"], "Roma", 3) // 3 punti
poi la funzione Question :
function Question(text, choices, answer, points) {
this.text = text;
this.choices = choices;
this.answer = answer;
this.points = points; // aggiunta
}
ed infine andrebbe modificato anche il seguente codice, ma non saprei il codice da usare:
Quiz.prototype.guess = function(answer) {
if(this.getQuestionIndex().isCorrectAnswer(answer)) {
this.score++; // da modificare con quale codice?
}
this.questionIndex++;
}grazie per un cortese aiuto.
Ultima modifica di un moderatore:
