测试与随机播放,图像和声音

时间:2016-06-08 17:46:48

标签: javascript html audio

我最近开始编码,我正在尝试进行测验! 测验是关于不同的乐队和艺术家。 但是,根据我现在获得的代码,我无法shuffle这些问题。如何让它们出现在random order中? 此外,不是在最后一个问题结束测验并给出正确/不正确的答案,我怎么能这样做而不是播放声音告诉用户是否正确或不正确。换句话说,测验循环有3个问题,但他们当时以洗牌顺序排在第1位。

我想改变的另一件事是;我如何制作它以便我可以将图像作为每个问题的背景,例如:这是什么乐队,以冷播放为背景。

如果有什么东西看起来不清楚或太宽泛,请询问,我会尽我所能来启发你。

HTML:

<h2 id="test_status"></h2>
<h2> Hvilket band er dette? </h2>
<div id="test"></div>

SCRIPT:

var pos = 0, test, test_status, question, choice, choices, chA, chB, chC, chD, chE, correct = 0;
var questions = [
    [ "Hvilket band er dette?", "Linkin Park", "Green Day", "Coldplay", "Billy Talent", "Hollywoodundead" ,"B" ],
    [ "Hvilket band har denne sangen?", "Linkin Park", "Green Day", "Coldplay", "Billy Talent", "Hollywoodundead" ,"A" ],
    [ "Hvilket band er dette?", "Linkin Park", "Green Day", "Coldplay", "Billy Talent", "Hollywoodundead" ,"B" ],


];
function _(x){
    return document.getElementById(x);
}    
function renderQuestion(){
    test = _("test");
    if(pos >= questions.length){
        test.innerHTML = "<h2>Du fikk "+correct+" av "+questions.length+" spørsmål riktige</h2>";
        _("test_status").innerHTML = "Quiz fullført";
        pos = 0;
        correct = 0;
        return false;
    }
    _("test_status").innerHTML = "Spørsmål "+(pos+1)+" av "+questions.length;
    question = questions[pos][0];
    chA = questions[pos][1];
    chB = questions[pos][2];
    chC = questions[pos][3];
    chD = questions[pos][4];
    chE = questions[pos][5];
    test.innerHTML = "<h3>"+question+"</h3>";
    test.innerHTML += "<input type='radio' name='choices' value='A'> "+chA+"<br>";
    test.innerHTML += "<input type='radio' name='choices' value='B'> "+chB+"<br>";
    test.innerHTML += "<input type='radio' name='choices' value='C'> "+chC+"<br>";
    test.innerHTML += "<input type='radio' name='choices' value='D'> "+chD+"<br>";
    test.innerHTML += "<input type='radio' name='choices' value='E'> "+chE+"<br><br>";
    test.innerHTML += "<button onclick='checkAnswer()'>Neste</button>";
}
function checkAnswer(){
    choices = document.getElementsByName("choices");
    for(var i=0; i<choices.length; i++){
        if(choices[i].checked){
            choice = choices[i].value;
        }
    }
    if(choice == questions[pos][5]){
        correct++;
    }
    pos++;
    renderQuestion();
}
window.addEventListener("load", renderQuestion, false);

的jsfiddle:

https://jsfiddle.net/cxjth78k/

0 个答案:

没有答案