给出正确答案后如何给h1div + 1?

时间:2015-03-25 13:17:59

标签: javascript jquery html

我使用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;
 }

希望有人可以帮助我.......

1 个答案:

答案 0 :(得分:1)

你的意思是你只需要在h1标签中增加值吗?

如果是这样,我会通过改变代码的这一部分来做到这一点

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

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