• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Memory Hilfe

A

Asder

New member
Hallo
Ich wollte euch fragen, wieso nur das Bild Nr.6 angezeigt wird und die anderen nicht.
Hier ist mein Code
Könntet ihr mir Verbesserungsvorschläge geben und das Problem mit Bild Nr.6 lösen?

Code: 
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<script language="JavaScript">


var pics = new Array();
for (i = 0; i <= 17; i++) {
        pics[i] = new Image();
        pics[i].src = 'memory' + i + '.jpg';
}
var map=new Array(6,6);
var user = new Array();
var temparray = new Array();
var clickarray = new Array(0, 0);
var ticker, sec, min, ctr, id, oktoclick, finished;

function init() {
        clearTimeout(id);
        for (i = 0; i <= 35 ;i++) {
                user[i] = 0;
        }
        ticker = 0;
        min = 0;
        sec = 0;
        ctr = 0;
        oktoclick = true;
        finished = 0;
        document.f.b.value = "";
        scramble();
        runclk();

        for (i = 0; i <= 35; i++) {
                document.f[('img'+i)].src = "memoryrück.jpg";
        }
}

function runclk() {
        min = Math.floor(ticker/60);
        sec = (ticker-(min*60))+'';
        if(sec.length == 1) {sec = "0"+sec};
        ticker++;
        document.f.b.value = min+":"+sec;
        id = setTimeout('runclk()', 1000);
}

function scramble() {
        for (z = 0; z < 5; z++) {
                for (x = 0; x <= 35; x++) {
                        temparray[0] = Math.floor(Math.random()*36);
                        temparray[1] = map[temparray[0]];
                        temparray[2] = map[x];
                        map[x] = temparray[1];
                        map[temparray[0]] = temparray[2];
                }
        }
}

function showimage(but) {
        if (oktoclick) {
                oktoclick = false;
                document.f[('img'+but)].src = 'memory'+map[but]+'.jpg';
                if (ctr == 0) {
                        ctr++;
                        clickarray[0] = but;
                        oktoclick = true;
                } else {
                        clickarray[1] = but;
                        ctr = 0;
                        setTimeout('returntoold()', 600);
                }
        }
}

function returntoold() {
        if ((clickarray[0] == clickarray[1]) && (!user[clickarray[0]])) {
                document.f[('img'+clickarray[0])].src = "image0.jpg";
                oktoclick = true;
        } else {
        if (map[clickarray[0]] != map[clickarray[1]]) {
                if (user[clickarray[0]] == 0) {
                        document.f[('img'+clickarray[0])].src = "image0.jpg";
                }
                if (user[clickarray[1]] == 0) {
                        document.f[('img'+clickarray[1])].src = "image0.jpg";
                }
                }
                if (map[clickarray[0]] == map[clickarray[1]]) {
                        if (user[clickarray[0]] == 0&&user[clickarray[1]] == 0) { finished++; }
                        user[clickarray[0]] = 1;
                        user[clickarray[1]] = 1;
                }
                if (finished >= 18) {
                        alert('Du hast es in '+document.f.b.value+' geschafft!');
                        init();
                } else {
                        oktoclick = true;
                }
        }
}

window.onload=init;


</script>
<center>
<h2>Memory</h2>
<form name="f">
<table cellpadding="0" cellspacing="0" border="0">
<script language="JavaScript">

for (r = 0; r <= 5; r++) {
        document.write('<tr>');
        for (c = 0; c <= 5; c++) {
                document.write('<td align="center">');
                document.write('<a href="javascript:showimage('+((6*r)+c)+')" onClick="document.f.b.focus()">');
                document.write('<img src="image0.gif" name="img'+((6*r)+c)+'" border="0">');
                document.write('</a></td>');
        }
        document.write('</tr>');
}

</script>
</table>
<br /><br />
<input type="button" value="         " name="b" onclick="init()" />
</form>
</center>

<br />

<meta name="author" content="Administrator">
<meta name="editor" content="html-editor phase 5">
</head>
<body>

</body>
</html>
 
Zuletzt bearbeitet von einem Moderator:
Das Problem mit den Bilder kommt daher, dass in der Variable map nicht das drin steht, was du denkst.

new Array(6, 6) erzeugt kein zweidimensionales Array mit jeweils sechs Einträgen in jeder Dimension, sondern ein Array mit den beiden Einträgen 6 und 6... wegen diesem missführenden Verhalten des Array-Konstruktors sollte man ihn auch nicht verwendne, sondern besser die Literalschreibweise:
Code: 
var map = [];
for (var i = 0; i < 18; i += 1){
	map.push(i);
	map.push(i);
}

Aber dein Code hat viel Platz für Verbesserungen:
  • Dein HTML ist invalide - jag' das mal durch einen Validator
  • das language-Attribut ist veraltet -> weg damit
  • Wie schon oben erwäht die Array-Konstruktoren durch Literalschreibweise ersetzen
  • die ganzen globalen Variablen sind unnötig (v.A. dein globales i kann sehr schnell Probleme machen)
  • Zeiten über window.setTimeout() zu messen ist keine gute Idee, da das ziemlich ungenau ist. Zur Zeitmessung gibt es Date-Objekte.
  • deine "scramble"-Funktion erzeugt keine zufällige Mischung und ist ineffektiv
  • document.write() ist nicht dien Freund. Verwende lieber .innerHTML oder gleich die DOM-Methoden umd Elemente zu erzeugen.
  • <a href="javascript:..."> ist jetzt nicht dein Ernst... v.A. da du ja sowieso schon einen onclick-Eventlistener setzt.
 
kkapsner schrieb:
Das Problem mit den Bilder kommt daher, dass in der Variable map nicht das drin steht, was du denkst.

new Array(6, 6) erzeugt kein zweidimensionales Array mit jeweils sechs Einträgen in jeder Dimension, sondern ein Array mit den beiden Einträgen 6 und 6... wegen diesem missführenden Verhalten des Array-Konstruktors sollte man ihn auch nicht verwendne, sondern besser die Literalschreibweise:
Code: 
var map = [];
for (var i = 0; i < 18; i += 1){
	map.push(i);
	map.push(i);
}

Aber dein Code hat viel Platz für Verbesserungen:
  • Dein HTML ist invalide - jag' das mal durch einen Validator
  • das language-Attribut ist veraltet -> weg damit
  • Wie schon oben erwäht die Array-Konstruktoren durch Literalschreibweise ersetzen
  • die ganzen globalen Variablen sind unnötig (v.A. dein globales i kann sehr schnell Probleme machen)
  • Zeiten über window.setTimeout() zu messen ist keine gute Idee, da das ziemlich ungenau ist. Zur Zeitmessung gibt es Date-Objekte.
  • deine "scramble"-Funktion erzeugt keine zufällige Mischung und ist ineffektiv
  • document.write() ist nicht dien Freund. Verwende lieber .innerHTML oder gleich die DOM-Methoden umd Elemente zu erzeugen.
  • <a href="javascript:..."> ist jetzt nicht dein Ernst... v.A. da du ja sowieso schon einen onclick-Eventlistener setzt.
Zum Vergrößern anklicken....


Kannst du mir den Script bearbeiten?
Ich verstehe nicht genau was du meinst. Seitdem ich dein Verbesserungsvorschlag benutzt habe, werden die Rückseiten nicht mehr angezeigt.
 
Danke für den Tipp, jedoch funktioniert es dadurch nicht mehr. Könntest du mir einen Script schicken, in dem du das Problem gefixt hast?
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben