Fehler in einem Memoryspiel für ein Fachreferat!
Sören
- javascript
0 ChrisB0 Sören
0 Felix Riesterer
Hi,
ich habe folgenden Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Memory</title>
<style type="text/css">
* {
padding: 0px;
margin: 0px;
}
.one {
position: relative;
top: 50px;
left: 50px;
border: #000 1px solid;
width: 80%;
}
.two {
position: relative;
width: 100px;
z-index: 1;
float:left;
background-repeat:no-repeat;
}
</style>
</head>
<body>
<!--Script-->
<script type="text/javascript">
//Initialisieren der Variablen
var count = 0;
var x = 0;
var test = 0;
var n = 0;
var zeilebruch = 0;
var d1 = "";
var d2 = "";
var versuche = 0;
//Einlesen der Grafiken
var pic_close = '<img src="img/back.jpg" />';
//Erzeugung Der Zufallszahlen
numbers1 = new Array();
while (numbers1.length < 16) {
x = Math.floor(Math.random() * 16) + 1;
if (numbers1.length==0) {
numbers1.push(x);
} else {
test = 1;
for (i = 0; i < numbers1.length; i++) {
if (x == numbers1[i]){test++;break;};
}
if(test==1){numbers1.push(x);}
}
}
for (i = 0; i < numbers1.length; i++) {
if (numbers1[i] > 8) {numbers1[i] = numbers1[i] - 8;};
}
//Funktionen
function versuch(element) {
element.style.visibility = "hidden";
if (d1 == "") {d1 = element.parentNode.id;}
else if (d1 != "") {d2 = element.parentNode.id;}
if (d1 == d2) {alert("Sie haben ein pärchen gefunden"); d1 = ""; d2 = ""}
else if (d1 != d2) {document.getElementById(d1).style.visibility = "visible"; document.getElementById(d2).style.visibility = "visible"; d1 = ""; d2 = ""}
versuche++;
document.getElementById('try').value = versuche
}
//Erstellen des Feldes
n = numbers1.length;
document.write('<div class="one">');
for (i = 1; i <= numbers1.length; i++){
document.write('<span class="two" style="background-image: url(img/'+numbers1[count]+'.jpg)" id="s'+numbers1[count]+'"><img src="img/back.jpg" onClick="versuch(this)" id=i'+numbers1[count]+'/></span>');
zeilebruch++;
if (zeilebruch==4) {document.write('<br style="clear: left;">'); zeilebruch=0};
count++;
}
document.write('<br><input type="text" id="try" value="Versuche"></div>');
</script>
</body>
</html>
Der Code ist ein Memoryspiel. Das Problem das ich dabei noch habe ist, das wenn ich zwei Karten aufdecke, die nicht gleich sind, sich die visibility von dem back.jpg nicht wieder auf visible setzt. Außerdem wird mir, wenn ich das erste mal auf ein Kärtchen klicke gesagt, das d2 keine Proporties hat. Ansonsten funktioniert der Code einwandfrei, jedenfalls soweit ich das beurteilen kann. Es wäre super, wenn mir jemand helfen kann, da ich es für ein Fachreferat in der Schule brauche. Unter [link]www.blackpanter.net/sonstiges/memory.html[/link] kann man es sich auch anschauen oder unter [link]www.blackpanter.net/sonstiges/fachreferat.zip[/link] runterladen
Gruß
Sören
Hi,
Das Problem das ich dabei noch habe ist, das wenn ich zwei Karten aufdecke, die nicht gleich sind, sich die visibility von dem back.jpg nicht wieder auf visible setzt.
Onclick faengst du auf dem Bild selber ab, und machst dieses "hidden".
Dann nimmst du dir aber die Referenz auf dessen parentNode, und veraenderst anschliessend ggf. dessen visibility.
Außerdem wird mir, wenn ich das erste mal auf ein Kärtchen klicke gesagt, das d2 keine Proporties hat.
Natuerlich - d1 enthaelt dann bereits eine ID, d2 aber nicht. Trotzdem wendest du auf *beide* getElementById an, und versuchst dann mit dessen Rueckgabe noch was anzustellen - aber getElementById liefert dir gar kein verwertbares Objekt, wenn die uebergebene ID lediglich "" ist.
Ansonsten funktioniert der Code einwandfrei, jedenfalls soweit ich das beurteilen kann.
Na ja, mit dem Encoding der Seite stimmt aber noch was nicht. Und die BOM bekomme ich im FireFox auch oben links in der Seite angezeigt.
Es wäre super, wenn mir jemand helfen kann, da ich es für ein Fachreferat in der Schule brauche.
Lernt ihr sowas in der Schule?
Dann sollte euer Lehrer euch aber auch mal beibringen, wie man
MfG ChrisB
Hi,
unser Lehrer bringt uns über JavaScript leider nix bei...er hat versucht uns VisualBasic beizubringen...
JavaScript hab ich mir mehr oder weniger erfolgreich selber beigebracht...
mit DOM-Methoden kenn ich mich leider überhaupt net aus...und reinlesen kann ich mich auch nich mehr...ich muss das bis Freitag fertig haben...
Der Hinweis, das ich auf Span-Tag zu greife, hat mir sehr weitergeholfen...
Die Funktion sieht jetzt so aus:
function versuch(element) {
element.style.visibility = "hidden"
if (d1 == "") {d1 = element.id;}
else if (d1 != "") {d2 = element.id;}
if (d1 == d2) {alert("Sie haben ein Pärchen gefunden!");d1 = ""; d2 ="";}
if (d1 != d2 && d1 != "" && d2 != "") {document.getElementById(d1).style.visibility = "visible"; document.getElementById(d2).style.visibility = "visible"; d1 = ""; d2 = "";}
versuche++;
document.getElementById('try').value = versuche
}
Dummerweise spinnt das ganze so rum...es wird nicht korrekt wieder zugedeckt...
Ich hab auch leider nicht mehr viel zeit...muss das bis Freitag fertig haben...wäre echt sehr dankbar, wenn mir jemand sagen könnt, wie ichs hinbekomme, das es korrekt funktioniert.
Gruß
Sören
Lieber Sören,
function versuch(element) {
element.style.visibility = "hidden"
if (d1 == "") {d1 = element.id;}
else if (d1 != "") {d2 = element.id;}
Deine Variablen d1 und d2 sind globale Variablen? Jedenfalls werden sie in der Funktion nicht extra deklariert und müssen dann als global verstanden werden. Das kann sehr schnell größere Probleme bereiten. Je nach Browser kann das unterschiedliche weitere Problemstellen verursachen - muss aber nicht.
> Dummerweise spinnt das ganze so rum...es wird nicht korrekt wieder zugedeckt...
Das könnte damit zusammenhängen, dass Du nicht zwischen globalen und lokalen Variablen sauber trennst. Ich habe Dir oben ein zugegebenermaßen sehr komplexes und umfangreiches Script verlinkt, aber vielleicht findest Du in seinem Quelltext ein paar Hinweise, die Dir bei Deinen Strukturen helfen...
Liebe Grüße aus [Ellwangen](http://www.ellwangen.de/),
Felix Riesterer.
--
ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)
Lieber Sören,
suchst Du sowas? Memory Quiz
Liebe Grüße aus Ellwangen,
Felix Riesterer.