JSFiddle - React, Tailwind, and code Playground
HTML
<div id="partituur"></div>
<div id="antwoord"></div>
<div id="buttons">
<button type="button" id="derde">
Derde
</button>
<button type="button" id="vierde">
Vierde
</button>
<button type="button" id="keuze">
Keuze
</button>
</div>
JavaScript
(function(){
var antwoordenAnswers = [];
var antwordenPartituur = 0;
var antwoordVerwacht = null;
var vierdeNaamval = [
"bis", "durch", "für", "gegen",
"ohne", "um", "entlang"
],
derdeNaamval = [
"aus", "bei", "mit", "nach", "seit",
"von", "zu", "entgegen", "außer",
"gegenüber", "an...vorbei"
],
keuzevoorzetsel = [
"an", "auf", "hinter", "neben", "in",
"über", "unter", "vor", "zwischen"
];
var accusative = vierdeNaamval,
dative = derdeNaamval,
choicePreposition = keuzevoorzetsel;
var opties = [vierdeNaamval, derdeNaamval, keuzevoorzetsel];
var options = opties;
var getRandomItem = function( a ){
return a[Math.floor((a.length-1)*Math.random())];
};
var vraagQuestion = function(){
var a = getRandomItem( opties );
if ( a === vierdeNaamval ) {
antwoordVerwacht = '3';
}
else if ( a === derdeNaamval ) {
antwoordVerwacht = '4';
}
else if ( a === keuzevoorzetsel ) {
antwoordVerwacht = 'k';
}
var b = getRandomItem( a );
document.getElementById('antwoord').innerHTML = b;
};
var zettenPartituur = function( a ){
document.getElementById('partituur').innerHTML = a;
};
var klikOpDeKnop = function(e){
var a = e.target ? e.target : e.srcElement;
var corrigeren = null;
switch ( a.id ) {
case 'derde':
corrigeren = ( antwoordVerwacht == '3' );
break;
case 'vierde':
corrigeren = ( antwoordVerwacht == '4' );
break;
case 'keuze':
corrigeren = ( antwoordVerwacht == 'k' );
break;
}
if ( corrigeren ) {
alert('good!');
antwordenPartituur++;
}
...