Question

我一直试图通过5个问题进行这个javascript测验，可以同时显示图像或声音的onclick按钮。

测验的要点是猜测哪个艺术家属于哪个图片或声音。但问题是当我试图在框中添加一张图片或按钮时，“hvilket band er dette？”它崩溃了测验。此外，似乎没有计算正确和不正确的问题的点数。

如果有人知道如何修复它会很棒。编辑：还需要帮助将测验集中在“横幅”下面。代码：

<html>

<head>
<meta charset="UTF-8">
  <title>fagdag 26.04.2016 helårs</title>
  <style>
    #banner {
      text-align: center;
      width: 50%;
    }
    .pulsate {
      -webkit-animation: pulsate 3s ease-out;
      -webkit-animation-iteration-count: infinite;
      opacity: 0.5;
    }
    @-webkit-keyframes pulsate {
      0% {
        opacity: 0.5;
      }
      50% {
        opacity: 1.0;
      }
      100% {
        opacity: 0.5;
      }
    div#test{ 
    border:#000 1px solid; 
    padding:10px 40px 40px 40px; 
      }
    }
  </style>
</head>

<body>
  <div onmouseover="PlaySound('mySound')" onmouseout="StopSound('mySound')" id="banner">
    <img src="http://i.imgur.com/SrnpgpD.jpg" style="z-index: 0; position: absolute; text-align; center">
    <img class="pulsate" src="http://i.imgur.com/t2Pil1a.png" style="z-index: 1; position: absolute; text-align;center">
  </div>
  <br>
  <br>

<h2 id="test_status"></h2>
<h2> Hvilket band er dette? </h2>
<div id="test"></div>
  <audio id='mySound' src='vivalavida.mp3' />


  <script type="text/javascript">
    function PlaySound(soundobj) {
      console.log("hi")
      var thissound = document.getElementById(soundobj);
      thissound.play();
    }

    function StopSound(soundobj) {
      var thissound = document.getElementById(soundobj);
      thissound.pause();
      thissound.currentTime = 0;
    }
  </script>
<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 er dette?", "Linkin Park", "Green Day", "Coldplay", "Billy Talent", "Hollywoodundead" ,"A" ],
    [ "Hvilket band er dette?", "Linkin Park", "Green Day", "Coldplay", "Billy Talent", "Hollywoodundead" ,"B" ],
    [ "Hvilket band er dette?", "Linkin Park", "Green Day", "Coldplay", "Billy Talent", "Hollywoodundead" ,"D" ],
    [ "Hvilket band er dette?", "Linkin Park", "Green Day", "Coldplay", "Billy Talent", "Hollywoodundead" ,"E" ],

];
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);
</script>
</body>

</html>

javascript测验没有按预期工作

0 个答案: