Zurzeut habe ich meine Mitspieler noch gar nicht gespeichert. Die Frage wurde gestellt bevor ich versucht habe eine Highscoreliste anzulegen.
Ich bin in Internet fündig geworden allerdigns funktioniert es nicht ganz.
Ich glaube der Fehler liegt irgendwie ab z. 65 ff wenn die Highscoreliste erstellt wird.
Es kann gut sein das da was fehlt und man es nachtragen muss. JS ist halt nicht die Programmiersprache meines Vertrauens aber mit Java und Visual Basic lassen sich halt keine Web-Applicationen schreiben :/.
Hier meine Internetquelle:
http://stevesohcot.com/tech-lessons-...demonstration/
Und mein verwurstelter Code:
Code:
<!DOCTYPE HTML>
<html>
<head>
<title> Kronkorkenspiel </title>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="json2.js"></script>
<script type="text/javascript">
// From: http://www.codingforums.com/showthread.php?t=228912
var questions = [
['http://i.colnect.net/images/b/335/157/Beck--s.jpg','DE'],
['http://i.colnect.net/images/b/334/229/Corona-Extra.jpg','ME'],
['https://www.hood.de/img1/big/2563/25637138.jpg','NL']
// Note: no comma after last entry
];
var qNo = 0;
var correct = 0;
var cnt = 0;
var arrHighScores = [];
arrHighScores.push( new objScore('2', '30') );
console-log(arrHighScores);
function NextQuestion(response) {
if ((qNo < questions.length) && (response == questions[qNo][1])) { correct++; }
document.getElementById('score').innerHTML
= 'Du hast '+correct+' Richtige';
qNo++;
if (qNo < questions.length) { document.getElementById('Pic').src = questions[qNo][0]; cnt++; }
else { alert('Quiz is done'); }
}
onload = function() {
document.getElementById('Pic').src = questions[0][0];
}
function objScore(richtige, seconds){
this.richtige = correct;
this.seconds = seconds
};
function SetHighScores() {
var myJsonString = JSON.stringify(arrHighScores);
localStorage.HighScores = myJsonString;
}
function RetrieveHighScores() {
// store in a local variable, incase null
var RawData = localStorage.HighScores;
// only process if not null
if (RawData != null) {
var HighScoresStored = JSON.parse(RawData);
arrHighScores = []; // reset
$.each(HighScoresStored, function(i, obj) {
arrHighScores.push( new objScore(obj.richtige, obj.seconds) );
});
}
}
funktion AddHighScore() {
RetrieveHighScores();
var Richtige = $('#richtige').val();
var Seconds = $('#seconds').val();
arrHighScores.push( new objScore(Richtige, Seconds));
console.log(arrHighScores);
arrHighScores.sort(funktion(a,b){return a.richtige-b.richtige});
SetHighScores();
ShowHighScore Values();
}
funktion ShowHighScoreValue () {
RetrieveHighScores();
$('#array_contents').html('High Scores:');
$.each(arrHighScores, funktion(i,obj){
$('#array_contents').append('<br/>' + obj.richtige + ' - ' +obj.seconds);
});
}
function ClearLocalStorage() {
localStorage.clear();
arrHighScores = [];
}
</script>
</head>
<body>
<body bgcolor="white">
<div align="center">
<h1>Kronkorken Spiel</h1>
<img src="" id="Pic" height="200" width="250">
<p>
<input type="image" src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/86/Flag_of_Germany_(3-2_aspect_ratio).svg/2000px-Flag_of_Germany_(3-2_aspect_ratio).svg.png" width="100" height="66" onclick="NextQuestion('DE')">
<input type="image" src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Flag_of_Mexico.svg/2000px-Flag_of_Mexico.svg.png" width="100" height="66" onclick="NextQuestion('ME')">
<input type="image" src="https://upload.wikimedia.org/wikipedia/commons/2/20/Flag_of_the_Netherlands.svg" width="100" height="66" onclick="NextQuestion('NL')">
<p>Deine Punktzahl: <br><span id="score"></span>
</div>
<h2>(Arrays, Objects, JSON, HTML 5 local storage)</h2>
<input type="button" value="Show High Scores" onclick="ShowHighScoreValues();" />
<input type="button" value="Clear" onclick="ClearLocalStorage();" />
<hr>
<br />Richtige: <input type="text" name="richtige" id="richtige" value="correct" />
<br />Seconds: <input type="text" name="seconds" id="seconds" value="45" />
<div id="array_contents"></div>
</body>
</html>