Блог

У меня есть функция, которая вычисляет оценку в опросе в зависимости от выбранного параметра, но я всегда получаю то же значение, которое находится в первом if условии, и я предполагаю, что проблема в переменной ответа, потому что она ничего не показывает.

 var questions = [
    {
        "question": "L'impact est ",
        "option1": "faible",
        "option2": "moyen",
        "option3": "haut",
    },
    {
       "question": "L'impact2 est ",
       "option1": "faible",
       "option2": "moyen",
       "option3": "haut",
    },
]

var currentQuestion = 0;
var score1 = 0;
var totQuestions = questions.length;
var number = 0;

var progressText = document.getElementById("progressText");
var container = document.getElementById('quizContainer');
var questionEl = document.getElementById('question');
var opt1 = document.getElementById('opt1');
var opt2 = document.getElementById('opt2');
var opt3 = document.getElementById('opt3');
var nextButton = document.getElementById('nextButton');
var resultCont = document.getElementById('result');
var chartBar = document.getElementById('bar-horzontal');

function loadQuestion(questionIndex) {
    var q = questions[questionIndex];
    questionEl.textContent = (questionIndex   1)   '. '   q.question;
    opt1.textContent = q.option1;
    opt2.textContent = q.option2;
    opt3.textContent = q.option3;
    progressText.innerText = questionIndex   1   ' de '   totQuestions   ' 
questions ';
};

function loadNextQuestion() {
    var selectedOption = 
 document.querySelector('input[type=radio]:checked');
     if (!selectedOption) {
         alert('veuillez sélectionner votre réponse');
         return;
     }

     var answer =selectedOption.Value;      
     if (questions[currentQuestion].opt1 == answer) {
         score1  = 1;
     } else if (questions[currentQuestion].opt2 == answer) {
         score1  = 2;
     } else {
         score1  = 3
     }

     selectedOption.checked = false;
     currentQuestion  ;
     progressText.textContent = questionEl / totQuestions

     if (currentQuestion == totQuestions - 1) {
        nextButton.textContent = 'Finish';
     }
     if (currentQuestion == totQuestions) {
         container.style.display = 'none';
         resultCont.style.display = '';
         resultCont.textContent = 'le résultat est '   ' '   score1   ' ' 
  answer ' ' ;
        return;
     }
     loadQuestion(currentQuestion);
 };
 loadQuestion(currentQuestion);
  

В HTML input элементы не имеют свойства textContent , поэтому вам не следует добавлять текст внутри radio элемента, вы можете использовать span или label .

Также q.opt1 есть undefined .

 var questions = [{
    "question": "L'impact est",
    "option1": "faible",
    "option2": "moyen",
    "option3": "haut"
  },
  {
    "question": "L'impact est",
    "option1": "faible",
    "option2": "moyen",
    "option3": "haut"
  }
]

var currentQuestion = 0;
var score1 = 0;
var totQuestions = questions.length;
var number = 0;

var progressText = document.getElementById("progressText");
var container = document.getElementById('quizContainer');
var questionEl = document.getElementById('question');
var opt1 = document.getElementById('opt1');
var opt2 = document.getElementById('opt2');
var opt3 = document.getElementById('opt3');
var lbl_1 = document.getElementById('lbl_1');
var lbl_2 = document.getElementById('lbl_2');
var lbl_3 = document.getElementById('lbl_3');
var nextButton = document.getElementById('nextButton');
var resultCont = document.getElementById('result');
var chartBar = document.getElementById('bar-horzontal');

function loadQuestion(questionIndex) {
  var q = questions[questionIndex];
  questionEl.textContent = (questionIndex   1)   '. '   q.question;
  opt1.value = lbl_1.textContent = q.option1;
  opt2.value = lbl_2.textContent = q.option2;
  opt3.value = lbl_3.textContent = q.option3;
  progressText.innerText = questionIndex   1   ' de '   totQuestions   ' questions ';
};

function loadNextQuestion() {
  var selectedOption = document.querySelector('input[type=radio]:checked');
  if (!selectedOption) {
    alert('veuillez sélectionner votre réponse');
    return;
  }

  var answer = selectedOption.value;
  if (questions[currentQuestion].option1 == answer) {
    score1  = 1;
  } else if (questions[currentQuestion].option2 == answer) {
    score1  = 2;
  } else {
    score1  = 3
  }

  selectedOption.checked = false;
  currentQuestion  ;
  progressText.textContent = "Answered: " (currentQuestion / totQuestions) * 100   "%";

  if (currentQuestion == totQuestions - 1) {
    nextButton.textContent = 'Finish';
  }
  if (currentQuestion == totQuestions) {
    nextButton.style.display = 'none';
    container.style.display = 'none';
    resultCont.style.display = '';
    resultCont.textContent = 'le résultat est '   ' '   score1   ' ';
    return;
  }
  loadQuestion(currentQuestion);
};
loadQuestion(currentQuestion);  

 <div id="quizContainer">
  <p id="question"></p>
  <input id="opt1" name="option" type="radio"><label for="opt1" id="lbl_1"></label>
  <input id="opt2" name="option" type="radio" /><label for="opt2" id="lbl_2"></label>
  <input id="opt3" name="option" type="radio" /><label for="opt3" id="lbl_3"></label>
</div>
<br/>
<button id="nextButton" onclick="loadNextQuestion()">Next</button>
<br/>
<p id="progressText"></p>
<div id="bar-horzontal"></div>
<div id="result"></div>  

Я думаю, вы говорите программе добавить дополнительный балл к вариантам 2 и 3. Посмотрите на приведенный ниже код, в котором вы предлагаете добавить 2 балла, если его вариант 2, и и 3 балла, если его вариант 3.

 } else if (questions[currentQuestion].opt2 == answer) {
   score1  = 2;
} else {
   score1  = 3
  

Я думаю, что они должны быть такими.

 } else if (questions[currentQuestion].opt2 == answer) {
   score1  = 1;
} else {
   score1  = 1