Neue Textdateien mit Wörter --------------------------- - als Trennzeichen Semikolon (;) verwenden - mit Codierung UTF-8 abspeichern (nicht als ANSI!!)
html { font-family:Verdana, Geneva, sans-serif; max-width: 470px; margin-left; 2px; margin-right: 2px; } header{ position: relative; } header h1 { text-shadow: -2px -2px 2px grey; font-size: 1.8em; margin-top: 2px; } header #sprachen { position: absolute; top: 3px; right: 0px; } #sprachen .inaktiv { opacity: 0.2; cursor: pointer; } #sprachen .aktiv { opacity: 1; border: 1px solid black; } nav#auswahl { margin-bottom: 20px; } nav#auswahl a { display: inline-block; background-color: #06C; color: white; padding: 2px 5px; text-decoration: none; font-size: 1.1em; margin-bottom: 5px; } nav#auswahl a:hover { background-color:#0C6; } nav#auswahl a.aktiv { background-color:#0C6; cursor:default; } #training { display: none; } #ausgabe { margin-top: 20px; margin-bottom: 20px; font-size: 1em; font-weight: bold; } #loesung { margin-top: 20px; margin-bottom: 20px; color:#093; font-size: 1em; } input { font-weight: bold; font-size: 1em; } #btnFalsch{ background-color:#FF0000; color: white; display: none; } #btnRichtig { background-color:#009900; color: white; display: none; } #KorrektTotal { font-size: 0.8em; margin-top: 20px; margin-right: 10px; text-align:right; }
var sprache = "englisch"; var daten = new Array(); var total = 0; var id = 0; var beantwortet = 0; $(document).ready(function(e) { // Standard Sprache laden (Themen holen und Fahne aktivieren) $("#"+sprache).attr("class", "aktiv"); $.get("getsubjects.php", { sprache:sprache }, function(data){ $("#auswahl").html(data); }); // Durch Klick auf Fahne wird Sprache geändert und Themen geholt var fahnen = $("#sprachen img"); fahnen.click(function() { sprache = $(this).attr("id"); fahnen.attr("class", "inaktiv"); $("#"+sprache).attr("class", "aktiv"); $.get("getsubjects.php", { sprache:sprache }, function(data){ $("#auswahl").html(data); }); // Training ausblenden $("#training").hide(); }); // wenn Auswahl getroffen: $("#auswahl").on("click","a", function(e) { e.preventDefault(); // href soll nicht ausgeführt werden var thema = $(this).attr("href"); // ausgewähltes Thema "aktiv" schalten (vorher alle Links inaktiv) $("#auswahl a").removeClass("aktiv"); $(this).attr("class", "aktiv"); // Vorbereitungen beantwortet = 0; $("#loesung").html(""); $("#korrekt").html("0"); $("#btnRichtig").hide(); $("#btnFalsch").hide(); // Daten aus Txt-File holen $.get("getdata.php", { sprache:sprache, thema:thema }, function(words){ //alert(words); //return; daten = $.parseJSON(words); // Zufalls-ID für daten erstellen total = daten.length; id = Math.floor(Math.random() * total); // daten ausgeben $("#ausgabe").html(daten[id][0]); $("#total").html(total); // training einblenden $("#training").show(); }); }); // Lösung anzeigen: $("#btnSolution").click(function() { var code = "" + daten[id][1] + ""; $("#loesung").html(code); $("#btnRichtig").show(); $("#btnFalsch").show(); }); // Richtig $("#btnRichtig").click(function() { //richtiges Wort aus daten-Array löschen daten.splice(id,1); $("#loesung").html(""); $("#btnRichtig").hide(); $("#btnFalsch").hide(); beantwortet++; $("#korrekt").html(beantwortet); if (beantwortet == total) { alert("Alle Fragen beantwortet!"); } else { // wenn noch nicht alle Fragen beantwortet wieder neue Zufalls-ID generieren id = Math.floor(Math.random() * (daten.length)); $("#ausgabe").html(daten[id][0]); } }); // Falsch $("#btnFalsch").click(function() { // wenn Antwort falsch wird zum nächsten Word gewechselt (wieder neue Zufalls-ID) // das falsche Wort nicht aus dem Array gelöscht $("#loesung").html(""); $("#btnRichtig").hide(); $("#btnFalsch").hide(); id = Math.floor(Math.random() * (daten.length)); $("#ausgabe").html(daten[id][0]); }); });