MBrendecke icon

JS Quiz

MBrendecke | PRO | 10/30/18 09:07:09 PM UTC | 0 ⭐ | 464 👁️ | Never ⏰ | []
HTML |

2.81 KB

|

None

|

0 👍

/

0 👎

<!DOCTYPE html>
<html lang="de">
 
<head>
    <title>Mein erstes Quiz</title>
   
    <script>
        function Quizfrage(frage, antwort) {
            this.frage = frage;
            this.antwort = antwort;
        }
       
        function GetQuizfragen() {
            return [
                new Quizfrage('Wie viel ist 18*3?', '54'),
                new Quizfrage('Wie viel ist 2*36?', '72'),
                new Quizfrage('Wie heißt die amtierende Bundeskanzlerin?', 'Angela Merkel'),
                new Quizfrage('Wie heißt der erfolgreichste Musiker der Welt?', 'Ed Sheeran'),
                new Quizfrage('Mit was für einem Auto verunglückte Paul Walker?', 'Porsche'),
                new Quizfrage('Wann war Mauerfall in Berlin? (TT.MM.JJJJ)', '09.11.1989'),
                new Quizfrage('Wann begann der Erste Weltkrieg? (JJJJ)', '1914'),
                new Quizfrage('Welches ist die größte deutsche Fluggesellschaft?', 'Lufthansa'),
                new Quizfrage('Wie heißt die Hauptstadt von Großbritannien?', 'London')
            ];
        }      
       
        let tries = 0;     
        function QuizStarten() {
            let score = 0;
            var quizfragen = GetQuizfragen();
            alert('Das Quiz beginnt nach Klick auf "OK".');
           
            var playerName = window.prompt('Wie heißt Du?');
            alert(`Viel Erfolg, ${(!playerName || !playerName.trim()) ? 'du Unbekannter': playerName}!`);
           
            for(i = 0; i < 5; i++) {
                index = Math.floor(Math.random() * quizfragen.length);
                frage = quizfragen[index];
                antwort = window.prompt(frage.frage);
               
                if(antwort != null && antwort.toLowerCase() == frage.antwort.toLowerCase()) {
                    alert(`Richtige Antwort! Weiter geht's mit Klick auf "OK".\n\nDu hast bisher ${++score === 1 ? 'eine Frage': score + ' Fragen'} richtig beantwortet.`);
                } else {
                    alert(`Leider falsch. Die richtige Antwort lautet: ${frage.antwort}.`);                
                }
                quizfragen.splice(index, 1);
            }
            alert(`Das Quiz ist zu Ende. Du hast ${score} von 5 Fragen richtig beantwortet.`);
            msg = [ 'noch nicht', 'einmal', 'zweimal', 'dreimal',
                    'viermal', 'fünfmal', 'sechsmal', 'siebenmal',
                    'achtmal', 'neunmal', 'zehnmal', 'elfmal',
                    'zwölfmal'
                    ];
            document.getElementById('paragraph').innerHTML = `Du hast das Quiz bisher ${tries <= 12 ? msg[tries++]: tries + ' mal'} gespielt.`;
        }
    </script>
   
</head>
 
<body>
    <p id='clickme' onclick="QuizStarten()">Quiz starten</p>   
    <p id='paragraph'></p>
</body>
 
</html>

Comments