Dislikes Dislikes:  0
Ergebnis 1 bis 3 von 3

Thema: Probleme mit JavaScript

  1. #1
    Avatar von peoplez0815
    Registriert seit
    29.12.17
    Danke (erhalten)
    0
    Gefällt mir (erhalten)
    0

    Standard Probleme mit JavaScript

    Anzeige
    Hallo Leute, ich versuche seit einigen Monaten mir JavaScript beizubringen.
    Bisher lief es eigentlich ganz gut, ich konnte meine Fehler immer finden und beseitigen. Ich habe mich vor kurzem an ein Quizspiel getraut, welches ich aus einem Buch habe. Ich habe das Programm samt HTML erst selbst geschrieben und später mit dem Buch abgeglichen. Natürlich hatte ich einige Fehler, war auch alles gut. Nur jetzt habe ich alles genauso wie es im Buch steht und das Programm funktioniert dennoch nicht. Ich habe das Buch natürlich auch beiseite gelegt und selbst recherchiert aber ich komme zu keinem Ergebnis. Ich habe langsam wirklich Kopfschmerzen und hoffe jemand kann mir hier mal auf die Sprünge helfen.
    Bitte.....

    Problem: Die Funktion mit der das Javascript abgerufen werden soll funktioniert nicht.(Meine Vermutung). // <div onclick="starteNeueRunde();"style="font-size:20px;background: #C2CFE4; border-radius: 70px;width: 550px; height: 150px;border: 20px solid #264B87;margin: 30px auto;text-align: center;box-shadow: inset 20px 10px 15px grey;"><p id="Frage">Willkommen zum Quiz</p><p id="Antworten">Klicke hier, um dein Quiz zu starten</p></div>


    Hier das komplette Programm:

    Code:
    <!DOCTYPE html>
    
    <html>
    <head>
    <title>QuiZZZzz</title>
    <meta charset="utf-8">
    
    <style>
      .auswahl {
      float: left; position: relative;
      background: white;
      height: 120px; width: 100px;
      margin: 20px; padding: 10px;
      font-size: 100px;
      box-shadow: 15px 15px 15px grey;
      }
      </style>
      </head>
    
    <body style="background:silver;">
    
    
    <div onclick="starteNeueRunde();"
    style="font-size:20px;
    background: #C2CFE4; border-radius: 70px;
    width: 550px; height: 150px;
    border: 20px solid #264B87;
    margin: 30px auto;
    text-align: center;
    box-shadow: inset 20px 10px 15px grey;">
    <p id="Frage">Willkommen zum Quiz</p>
    <p id="Antworten">Klicke hier, um dein Quiz zu starten</p>
    </div>
    
    <div style="width: 500px; height: 200px; margin: 1px auto; text-align: center">
    <p id="1" class="auswahl" onclick="tippeButton(this);">1</p>
    <p id="2" class="auswahl" onclick="tippeButton(this);">2</p>
    <p id="3" class="auswahl" onclick="tippeButton(this);">3</p>
    </div>
    </body>
    
    
    
    <script>
    
    var fragen = new Array();
    var runden = 0;
    var richtigeAntwort;
    var gesperrt = true;
    var punkte = 0;
    
    definiereDieFragen();
    
    
    
    
    function tippeButton(gewaehlterButton){
    	if(gesperrt){return}
    	gesperrt = true;
    	gewaehlterButton.style.boxShadow = "10px 10px 20px grey inset";
    	if(gewaehlterButton.getAttribute("id") == richtigeAntwort) {
    		punkte++;
    	}
    	else{gewaehlterButton.style.background = "#FF0000";
    	}
    }
    
    
    function starteNeueRunde(){
    	document.getElementById("1").style.boxShadow = "15px 15px 15px grey";
    	document.getElementById("1").style.background = "white";
    	document.getElementById("2").style.boxShadow = "15px 15px 15px grey";
    	document.getElementById("2").style.background = "white";
    	document.getElementById("3").style.boxshadow = "15px 15px 15px grey";
    	document.getElementById("3").style.background = "white";
    	
    	if ( runden < 5 ){
    		gesperrt = false;
    		runden++;
    		
    		dieFrage = fragen.shift();
    		var frageAufbereitet = dieFrage.split("#");
    		document.getElementById("Frage").innerHTML = frageAufbereitet[0];
    		document.getElementById("Antworten").innerHTML = frageAufbereitet[1];
    		richtigeAntwort = frageAufbereitet[2];
    		setTimeout(starteNeueRunde,3000);
    		
    	}else{
    		alert ("Das Spiel ist zu Ende. Du hast " + punkte + " Punkte geholt");
    	}
    }
    
    
    function definiereDieFragen(){
    	
    	fragen[0] = "Was ist keine Programmiersprache?#
    	1) JavaScript 2) HTML5 3) Python#2";
    	fragen[1] = "Wie heisst ein bekanntes Programm zum Knacken von Passwörtern?#
    	1) BruteForce 2) Powershell 3) JohnTheRipper#3";
    	fragen[2] = "Wie wird die Schnittstelle zwischen Hard- und Software bei einem Computer auch genannt?#
    	1) Kernel 2) CPU 3) Motherboard#1";
    	fragen[3] = "Wie heisst der größte Planet in unserem Sonnensystem?#
    	1) Erde 2) Saturn 3) Jupiter#3";
    	fragen[4] = "Was war Jules Verne?#
    	1) Autor 2) Astronom 3) Physiker#1";
    	fragen[5] = "Wie heisst der erste Mann auf dem Mond?#
    	1) Juri Gagarin 2) Nil Armstrong 3) Ed Mitchel#2";
    	fragen[6] = "Mit welchem Mittel kann man seine IP Adresse verschleiern?#
    	1)VPN 2) CSS 3) TKKG#1";
    	fragen[7] = "Wann endete der zweite Weltkrieg?#
    	1) 1950 2)1939 3)1945#3";
    	fragen[8] = "Wo wurde BamBam geboren?#
    	1) Egeln 2) Hamm 3) Frose#3";
    	fragen[9] = "Was ist ein roter Riese?#
    	1) Pickel 2) Himmelskörper 3) Artilleriegeschoss#2";
    	
    	
    	for(var i=1; i<9; i++){
    		fragen.sort( function(a,b){return Math.random()-0.5;} );
    	}
    }
    
    
    </script>
    </html>
    Geändert von bitmuncher (09.01.18 um 01:07 Uhr) Grund: Code-Tags eingefügt

  2. #2
    Moderator Avatar von bitmuncher
    Registriert seit
    30.09.06
    Danke (erhalten)
    153
    Gefällt mir (erhalten)
    1662

    Standard

    Deine Multiline-Strings sind falsch.

    Code:
    	fragen[0] = "Was ist keine Programmiersprache?#
    	1) JavaScript 2) HTML5 3) Python#2";
    Sowas funktioniert nicht und wenn du in deinem Browser mal die Javascript-Konsole/Entwicklertools öffnest, bekommst du dafür auch eine entsprechende Fehlermeldung:

    Code:
    Uncaught SyntaxError: Invalid or unexpected token
    Bei Multiline-Strings muss die Zeile mit einem Backslash enden. Also:

    Code:
    	fragen[0] = "Was ist keine Programmiersprache?# \
    	1) JavaScript 2) HTML5 3) Python#2";

  3. Danke peoplez0815 thanked for this post
    Gefällt mir Chromatin liked this post
  4. #3
    Avatar von peoplez0815
    Registriert seit
    29.12.17
    Danke (erhalten)
    0
    Gefällt mir (erhalten)
    0

    Standard

    Anzeige
    Vielen Dank für deine Hilfe,

    es lag tatsächlich an den Backslashes. Ich habe eben nochmal im ganzen Buch rumgeblättert konnte zu dem Thema aber nichts finden. Danke!

    Habe zwar noch einen Fehler gefunden aber es war zum Glück nur ein Rechtschreibfehler :-)
    Danke bitmuncher

    Mit freundlichen Grüßen
    peoplez
    Geändert von peoplez0815 (09.01.18 um 17:28 Uhr)

Ähnliche Themen

  1. Antworten: 0
    Letzter Beitrag: 21.08.13, 08:44
  2. JavaScript in JavaScript variable?
    Von lakata im Forum Code Kitchen
    Antworten: 9
    Letzter Beitrag: 16.11.12, 20:48
  3. Antworten: 7
    Letzter Beitrag: 08.12.10, 23:50
  4. JavaScript
    Von Chris im Forum Programmiersprachen
    Antworten: 0
    Letzter Beitrag: 17.12.02, 18:59
  5. JavaScript
    Von RedAngel im Forum (Web-) Design und webbasierte Sprachen
    Antworten: 2
    Letzter Beitrag: 27.11.01, 13:39

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •