javascript - 给出正确答案后如何给出h1div+1？

Question

我用 javascript 和 HTML 做了一个测验。现在我希望当你给出正确答案时 h1divcirckel 给出加 1。在我的 jsfiddle 中是 HTML 和 Javascript。该测验在 jsfiddle 中不起作用，但在我的网站中起作用。

https://jsfiddle.net/aveLph7h/

<div id="cirkel">
<h1>145</h1>
</div>

<h1>Quiz</h1>
<div id='quiz'></div>
<div id='button'>Next</div>

还有我的 JavaScript

var questions = [{
question: "Wie vinden zichzelf het lekkerst?",
choices: ["Vrouwen","Mannen"],
correctAnswer:0
},    {

question: "Wat doet meer pijn: wesp of bij?",
choices: ["wesp","bij"],
correctAnswer:0
},{
question: "What is 8*9?",
choices: [72,99,108,134,156],
correctAnswer:0
},{

question: "What is 1*7?",
choices: [4,5,6,7,8],
correctAnswer:3
},{

question: "What is 8*8?",
choices: [20,30,40,50,64],
correctAnswer:4
}];




function createQuestionElement(index) {
var qDiv = document.createElement('div');
qDiv.setAttribute('id','question');
var question = document.createElement('p');
question.innerHTML = questions[index].question;
qDiv.appendChild(question);
qDiv.appendChild(createRadios(index));
return qDiv;
}

function createRadios(index) {
var radioList = document.createElement('ul');
var str;
for(var i=0; i<questions[index].choices.length ; i++){
    var item = document.createElement('li');
    var input = '<input type="radio" name="answer" value=' + i 
        + ' />';
    input += questions[index].choices[i];

    item.innerHTML =input;
    radioList.appendChild(item);
}

return radioList;
}

var questionCounter = 0;
var numCorrect = 0;
var firstDiv = createQuestionElement(questionCounter);
$('#quiz').append(firstDiv);

var radios = document.getElementsByName('answer');
var button = document.getElementById('button');

$('#button').on('click', function() {
if(radios[questions[questionCounter].correctAnswer].checked){
    numCorrect++;
}

questionCounter++;
$('#question').remove();

if(questionCounter<questions.length){
    var nextDiv = createQuestionElement(questionCounter);
    $('#quiz').append(nextDiv);
    document.getElementById('quiz').appendChild(nextDiv);
} else {
    document.getElementById('quiz').appendChild(displayScore());
}
 });

 function displayScore() {
var para = document.createElement('p');
para.innerHTML = 'Je hebt ' + numCorrect + ' vragen uit  ' +
    questions.length + ' goed!!!';
return para;
 }

希望有人能帮助我......

Answer 1

您的意思是您只需要增加 h1 标记中的值吗？

如果是这样，我会通过更改那部分代码来做到这一点

    if(radios[questions[questionCounter].correctAnswer].checked){
         numCorrect++;
         $('#cirkel h1').html(parseInt($('#cirkel h1').html(), 10) + 1);
    }

在这里工作 jsFiddle https://jsfiddle.net/aveLph7h/1/