globale (Array-)Variable -> 'vokabeln' is undefiniert

jaycon

Grünschnabel
Schreibe eine VokabelabfrageSeite. Dabei verwende ich DOM und JavaScript.
Es existieren 4 JavaScipt-Dateien, wobei eine mein "Vokabelarray" darstellt.
Nach dem Erstellen der Vokabelabfrage, beim Klicken auf "Überprüfen" spuckt der IExplorer den Fehler aus: 'vokabeln' is undefiniert (dabei ist vokabeln mein bezeichner fürs Vokabelarray).
Mein Programm läuft unter allen Browsern (Opera, FIrefox, Netscape) nur unter InternetExplorer nicht...;-(
Jemand ne Ahnung? -Kann man so ne globale Variable in JS definieren, oder wo könnte sonst der Hund begraben sein?
Vielen Dank im Voraus!
 
Generell kann man globale Variablen/Arrays definieren, wie man lustig ist.

In deinem Falle wäre eine URL oder ein paar Dateien nicht schlecht...
 
Es existieren - 4 *.js-Dateien im Ordner(javascripts)
- 1 Css in stylesheets (nicht inkludiert)
- 1 HTML (nicht inkludiert)


1. Datei - Vokabelarray -> vokabeln2.js
Code:
var vokabeln = new Array();

	/* Es wird ein "großes" Vokabelarray erzeugt, indem alle Vokabeln abgespeichert sind pro Lektion.
	   Auf diese Array wird von alles anderen JavaScript-Dateien zugegriffen. Dieses Array,
	   mit vokabeln bezeichnet, enthält für jede Vokabel ein weiteres Array mit aufzählender Nummerierung.
	   
LECCIÓN DOS	*/

	vokabeln[0] = new Array("sprechen","hablar","Marisa habla son Carla.");
	vokabeln[1] = new Array("Klar","Claro","--leider kein Beispielsatz--");
	vokabeln[2] = new Array("intalienisch","italiano","Carla estudia italiano.");
	vokabeln[3] = new Array("studieren","estudiar","Carla estudia italiano.");
	vokabeln[4] = new Array("Sprache","lengua","El italiano es una lengua.");
	vokabeln[5] = new Array("wird gesprochen","se habla","En Italia se habla italiano.");

	var vokabelArrayGroesse = (vokabeln.length);
	// mit diesem Befehl wird die Arraygröße, also die Anzahl aller Vokabeln im Array a bestimmt.

2. Datei -> vokabelTestSchreiben2.js
Code:
/* Diese Funktion liefert ein Array mit einer gewünschten Anzhal von Zufallszahlen zurück

** Der Funktion werden die zwei Werte anzahl und arraygroesse uebergeben.
** "anzahl" ist die geforderte Anzahl an Zufallszahlen 
** "arraygroesse" ist die Größe des vokabel-Arrays als Zahl - hiermit wird der Maximalwert bestimmt	*/
function randomWerte(anzahl,arraygroesse){   

	var vokabelArrayGroesse = (vokabeln.length);
 	  
	/* es werden die Variablen angelegt und ein neues Array erzeugt, 
	** in das später die Zufallszahlen geschrieben werden */  
	var zahlen = new Array(anzahl);
	var vorhanden, zahl, maxWert;
	maxWert = arraygroesse; //da das Array bei 0 anfängt
	
	
	
	/* Überpruefung ob die erzeugt Zahl schon vorhanden ist
	** -ist diese Zahl schon vorhanden, wird i dekrementiert, und der Vorgang startet von Neuem
	** -ist diese Zahl noch nicht vorhanden, so wird diese Zufallszahl ins Array geschrieben */
	for (i=0; i<=anzahl; i++)
	{
	vorhanden = false;
		zahl = (Math.ceil(maxWert*Math.random())-1);

		for (j=0; j<=anzahl; j++) 
			{
			  if ( zahlen[j] == zahl) 
			{vorhanden = true; i--}};
		if (vorhanden == false) { zahlen[i]=zahl};
	};

	/* das Array mit den Zufallszahlen wird zurück gegeben */
	
	return zahlen;
	
}	


/********************************************************************************************************************
** Diese Funktion gibt die Vokabeln aus dem Vokabel Array (Datei vokabeln.js) geordnet in einer Tabelle aus */
function vokabelnAnzeigen(){
	
	var vokabelArray = (vokabeln);
	var vokabelArrayGroesse = (vokabeln.length);
	
			
	/* Die Seite wird aufgebaut */
	document.open("text/html");
	document.writeln("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");
	document.writeln("<html><head><title>Die Vokabel-Übersicht</title>");
	document.writeln("<link rel=\"stylesheet\" type=\"text/css\" href=\"stylesheets/standard.css\">");
	document.writeln("<script src=\"javascripts/vokabeln2.js\" type=\"text/javascript\"></script></head>");

	document.writeln("<body class=\"backmain\"><h1>Die Vokabeln in der &Uuml;bersicht </h1>");
	document.writeln("<table class=\"text\" cellspacing=\"10\" cellpadding=\"0\" border=\"0\" width=\"60%\">");
	document.writeln("<tr><td width =\"100\">DEU</td><td width =\"100\">SPA</td><td width =\"100\">Beispiel</td></tr>");

	/* in der Schleife werden nun das deutsche Wort, das spanische Wort und ein BeispielSatz in einer 
	** Tabelle ausgegeben */
	for (var q=0; q<(vokabelArrayGroesse); q++) {
		var deuVokabel = vokabelArray[q][0];
		var spaVokabel = vokabelArray[q][1];
		var beispielSatz = vokabelArray[q][2];
		document.write("<tr><td width =\"100\">"+deuVokabel+"</td>");
		document.write("<td width =\"100\">"+spaVokabel+"</td>");
		document.write("<td width =\"100\">"+beispielSatz+"</td></tr>");
	}
	
	document.writeln("</table><hr align=\"left\" width=\"50%\">");
	document.writeln("<input type=\"button\" value=\"zurück\" onClick=\"JavaScript:history.back()\">");
	document.writeln("</body></html>");
	document.close();
}



/********************************************************************************************************************
** Diese Funktion gibt den VokabelTest aus

/* der Funktion wird die "Richtung" des Vokabeltests übergeben (deutsche Wort vorgegben - spanisches ist 
** gesucht ODER spanisches Wort ist vorgegeben - deutsches wird gesucht */
function vokabelTestAnzeigen(richtung){

		var vokabelArrayGroesse = (vokabeln.length);

	/* Je nach "Richtung" werden Variablen für die Ausgabe gesetzt */
	var vokabel=1;	var uebersetzung=0;
	if (richtung=="DEU-SPA"){
		var vokabel= 0; var uebersetzung =1;
		}
	
	/* weitere Variabeln werden gesetzt. U.a wird in der Variable "zufallsWerte" mit Hilfe der Funktion 
	** randomWerte ein Array mit sich nicht wiederholenden Zufallszahlen erzeugt */ 
	var wieviele = ((document.wievieleVokabeln.elements[0].value)); // -> 4
	//var	richtigeAnzahl = wieviele;
	var vokabelArray = vokabeln;
	var zufallsWerte = randomWerte(wieviele,vokabelArrayGroesse);  


	/* Die Seite wird aufgebaut */
	document.open("text/html");
	document.writeln("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");
	document.writeln("<html><head><title>Vokabeltest Lección dos</title>");
	/* diese Zeile umgeht einen Bug beim Netscape Navigator - die vorherigen Eingaben eines Vokabeltestes
	** werden in den in den Cache geladen und bei einem neuen Test oder nach Aktualisieren ungewollt 
	** wieder in die Eingabe-felder geschrieben*/
//	document.writeln("<meta http-equiv=\"cache-control\" content=\"no-cache\" expires=friday, 25-may-05 23:06:12 gmt>");
	document.writeln("<link rel=\"stylesheet\" type=\"text/css\" href=\"stylesheets/standard.css\">");
	
	/* das standard stylesheet wird überschrieben, damit die 'BeispielSatz -Links" nicht unterstrichen, 
	** und somit schon vorher sichtbar sind */
	document.writeln("<style type=\"text/css\">A:LINK {text-decoration : none;}");
	document.writeln("A:VISITED {text-decoration : none}</style>");
	document.writeln("<script src=\"javascripts/vokabelTestPruefung2.js\" type=\"text/javascript\"></script>");
	document.writeln("<script src=\"javascripts/vokabeln2.js\" type=\"text/javascript\"></script></head>");
	document.writeln("<body class=\"backmain\"><h1>Vokabeltest Lección dos</h1>");
	document.writeln("<p class=\"text\">Umlaute bitte durch ae, oe oder ue ersetzen und die betonten Wörter entsprechend schreiben.</p>");
	document.writeln("<table class=\"text\" cellspacing=\"10\" cellpadding=\"0\" border=\"0\" width=\"60%\">");
	document.writeln("<tr><td></td><td></td><td></td><td></td></tr>");
	document.writeln("<form name=\"vokabeltest\">");

	for (var q=0; q<=(wieviele); q++) {   

		var eineZahl = zufallsWerte[q];  

		var myZufallsVokabel = vokabelArray[eineZahl][vokabel];
		document.write("<td width =\"100\">"+myZufallsVokabel+"</div></td>");
		document.write("<td width =\"100\"><input name=\"eingabe"+q+"\" type=\"Text\" value=\"\"></div></td>");

	/* ein Links auf die Funktion "beispielSatzAnzeigen" mit der übergebenen VokabelNr wird erzeugt. 
	** Diese Funktion zeigt die Beispiel Sätze aus dem vokabelArray an -jedoch sollte dieser Link nicht 
	** vor dem Überprüfen sichtbar sein- somit wird nur als Wert des <a>-Tags ein Leerzeichen angegeben
	** Dieses wird später durch die Funktion "pruefArray" sichtbar gemacht */ 
		document.write("<td width =\"100\"><span> &nbsp; </span></td><td width=\"30\"><a href=\"JavaScript:beispielSatzAnzeigen("+eineZahl+")\">&nbsp;</a></td></tr>");
	}
	
	document.writeln("</div></table><p class=\"text\"> &nbsp;</p><hr align=\"left\" width=\"70%\">");
	
	/* es werden der Button "Überprüfen" der die Funktion pruefArray aufruft und der Button "zurück" 
	** erstellt */
	document.writeln("<input type=\"button\" value=\"&Uuml;berpr&uuml;fen\" onClick=\"pruefArray((new Array("+zufallsWerte+")),\'"+richtung+"\')\">&nbsp;&nbsp;&nbsp;");
	document.writeln("<input type=\"button\" value=\"neuer Test\" onClick=\"JavaScript:self.location.href ='vokabelTest2.html'\">");
	document.writeln("</form></body></html>");
	document.close();
}


/********************************************************************************************************************
** Diese Funktion erstellt das Select Auswahlfeld mit 5-ern Schritten für die Anzahl der abzufragenden 
** Vokabeln */
	function selectButtonSchreiben(){
			var vokabelArrayGroesse = (vokabeln.length);
		document.writeln("<select name=\"wieviel\" size=\"1\">");
			for (var i=5; i<=vokabelArrayGroesse; i=i+5){	
			document.writeln("<option value="+(i-1)+">"+(i)+" Vokabeln</option>");
			}
		document.writeln("<option value="+(vokabelArrayGroesse-1)+">alle ("+(vokabelArrayGroesse-1)+")</option></select>");
/* da das Array bei Null anfängt müssen bei den übergebenen Variablen einer abgezogen werden */
} 

3. Datei ->VokabelTestPruefung2.js
/* Diese Funktion erzeugt ein PopUpFeld (alert), welches den Beispielsatz zeigt
** der Funktion wird die Nummer der Vokabel übergeben. Dieses wurde in der Funktion vokabelTestAnzeigen
** getan. Der passende Beispielsatz zur gewählten Vokabel befinden sich immer an der 3. Stelle, also an [2]
** eines "Unterarrays"- dieser Wert wird ausgegeben */
function beispielSatzAnzeigen(nummer){
        var vokArray = vokabeln;
        alert (vokArray[nummer][2]);
        }

/****************************************************************************************
** Diese Funktion stellt die eigentliche Überpruefung der Eingabe dar. Die Besonderheit dieser
** Prüfung liegt darin, dass, falls mehrere Möglichkeiten richtig sind, nur eine Möglichkeit
** eingegeben werden muss */
function pruefung(input,gesuchteWoerter){
         var ra =/\w+\s?\w*\s?\w*\s?\w*/g;
        var gesuchte = gesuchteWoerter.match(ra);

        var treffer = false;
        /* Überpruefung: entspricht der eingegebene Wert einem Wert aus dem erstellten Array, so wird die
        ** Variable "treffer" auf true gesetzt */
        if (input == gesuchte){ var treffer = true}
        for(i=0;i<(gesuchte.length);i++){
                if (input == gesuchte[i]){
                        var treffer = true;}
}
/* die Variable treffer wird zur weiteren Verarbeitung ausgegeben */
return treffer;
}


/********************************************************************************************************************
** Diese Funktion prüft die Eingaben und zeigt das Ergebnis an. Zudem wird der Link zu der
** "beispielSatzAnzeigen"-Funktion sichtbar gemacht */

/* übergeben wird das zufallswerte-Array und die "Richtung" DEU-SPA/SPA-DEU */
function pruefArray(myarray,richtung){


/* Je nach übergebener Richtung werden die Variablen zum Überprüfen gesetzt */
        var vokabel=1;        var uebersetzung=0;
        if (richtung=="DEU-SPA"){
                var vokabel= 0; var uebersetzung =1;
                }

        var vokArray = vokabeln;
        var wieviele = (myarray.length);
	// an dieser Stelle hängt der IExplorer. Firefox und Netscape haben keine Probleme! 
        var richtig= 0;
        var falsch = 0;

        for (var i=0; i<(wieviele); i++) {
                var zufallsWert = ((myarray[i]));

                var arraywert = vokArray[zufallsWert][uebersetzung]; //das oder die gesuchten Wörte/r

                var input = document.vokabeltest.elements[i].value;

                // Aufrufen der Pruefungs-Funktion und Überprüfung des Rückgabewertes der Funktion
                if(pruefung(input,arraywert)){

                /* entsprach die Eingabe einem der gesuchten Wörter, so wird die Variable "richtig" um 1 erhöht,
                ** das Eingabefeld grün gefärbt und ein "richtig" in die Spalte hinter dem Eingabefled
                ** geschrieben. */
                        richtig++;
                        document.vokabeltest.elements[i].style.backgroundColor = "lightgreen";
                        document.getElementsByTagName("span")[i].firstChild.data = "richtig!";
                        }

                /* entsprach die Eingabe keinem der gesuchten Wörter, so wird die Variable "falsch" um 1 erhöht,
                ** das Eingabefeld rot gefärbt und "gesucht war:" gefolgt von der gesuchten Übersetzung in die
                ** Spalte hinter dem Eingabefeld geschrieben. */
                else {
                        falsch++;
                        document.vokabeltest.elements[i].style.backgroundColor = "red";
                        document.getElementsByTagName("span")[i].firstChild.data = "richtig ist: "+ vokabeln[zufallsWert][uebersetzung];
                        }

                /* in jedem Fall wird der Link auf die Funktion beispielSatzAnzeigen sichtbar gemacht, indem
                ** der Wert zwischen den <a>-Tags vom nichtsichtbaren &nbsp; zu "Beispielsatz" geändert wird */
                document.getElementsByTagName("a")[i].firstChild.data = "Beispielsatz";
                }

        /* unter die Eingaben wird das Ergebniss des Testes durch die hochgezählten Variablen "richtig"
        ** und "falsch" wiedergegeben */
        document.getElementsByTagName("p")[1].firstChild.data = "Du hast richtig: "+richtig+" - Du hast falsch: "+falsch;
}

4. Datei ->javascript.js
function enthaelt(liste, wort)
  {
  /* Die Funktion enthaelt erwartet zwei Parameter. Dabei muss der erste Parameter 
     ein beliebiges Array (eine Liste) sein. Eben dieses Array überprüft die Funktion,
     und sagt ob ein String, eben der zweite Parameter, ordnungsgemäß übergeben wurde.
     Mit der Wahrheitsabrage wird also entweder true oder false returned.
  */
  
  ergebnis = false;
  // zu Begin wird der Returnwert von ergebnis auf den Wahrheitswert false gesetzt.
  
  for (var i=0; i<=liste.length; i++)
	  {
    // Die Schleife durchlaeuft das gesamte Array, der Endwert wird mit
	// der Methode length ermittelt.
	
	if (liste[i] == wort) {ergebnis = true};
	// Sollte der Wert des Array gleich dem zweiten parameter, dem String, ist, 
	// wird der Returnwert von ergebnis auf den Wahrheitswert true gesetzt.
	
   };
  return ergebnis;
  // Der Wahrheitswert ergebnis wird als Boolean-Ergebins aus der Methode zurueckgegeben.
  
 };

Vielen Dank
 
Kannst du bitte auch mal das HTML-Dokument dazu posten, damit man sieht, welche Skripte in welcher Reihenfolge eingangs überhaupt verfügbar sind.
 
folgendes HTML-Dokument und CSS-DAtei...damit wärs komplett (vorher zuviele Zeichen)

1. HTML -> vokabelTest2.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Spanisch-Vokabeltest</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<LINK href="stylesheets/standard.css" rel="stylesheet" type="text/css">

<script src="javascripts/vokabeln2.js" type="text/javascript"></script><!-- Array mit den Vokabeln//-->
<script src="javascripts/vokabelTestSchreiben2.js" type="text/javascript"></script>
<!-- -> obwohl diese Funktionen nicht zum erstellen benötigt werden, müssen sie schon hier geladen werden,
-> damit die erstellte Seite sofort drauf zugreifen kann. -Ohne diese Zeile hängt sich der Internetexplorer
-> auf. -Der Netscape Navigator nicht. //-->
<script src="javascripts/vokabelTestPruefung2.js" type="text/javascript"></script>

</head>
<body class="backmain">
<h1>Vokabeltest Lección dos</h1>
<p class="text">

Wieviele Vokabeln soll der Test enthalten?
</p>
<form name="wievieleVokabeln" action="">
<script type="text/javascript">
selectButtonSchreiben();
</script>


<input type="button" value="Test DEU-SPA" onClick="vokabelTestAnzeigen('DEU-SPA')">
<input type="button" value="Test SPA-DEU" onClick="vokabelTestAnzeigen('SPA-DEU')">

<br>
<p class="text">..oder zuerst alle Vokabeln anzeigen lassen? </p>
<input type="button" value="JA- erst anzeigen" onClick="vokabelnAnzeigen()">
</form>


</body>
</html>

2. CSS-Datei ->standard.css

A:LINK {
font-family : Arial, Helvetica, sans-serif;
font-size : 12px;
font-weight : normal;
color : #0000FF;
background-color : transparent;

}

A:ACTIVE {
font-family : Arial, Helvetica, sans-serif;
font-size : 12px;
font-weight : normal;
color : #0000FF;
background-color : transparent;
}

A:VISITED {
font-family : Arial, Helvetica, sans-serif;
font-size : 12px;
font-weight : normal;
color : #0000FF;
background-color : transparent;
}

A:HOVER {
font-family : Arial, Helvetica, sans-serif;
font-size : 12px;
font-weight : normal;
color : #FF0000;
background-color : transparent;
}

H1 {
color : orange;
background-color : transparent;
font-size : large;
font-family : Arial, Helvetica, sans-serif;
font-style : italic;
}

.text {
font-size : 12px;
font-family : Arial, Helvetica, sans-serif;
width : 550px;
}

LI {
font-family : Arial, Helvetica, sans-serif;
font-size : 12px;
font-weight : normal;
}

div.topmenue {
margin-top: 25px;
margin-left: 12px;

}

INPUT {
background: orange;
border: thin groove;
height : 25px;
width : 105px;
font-size : 11px;
font-family : sans-serif;
margin-top : 5px;
color : #000000;
}

INPUT.subbutton {
font-style : oblique;
border : none;
margin-top : 1px;
}

INPUT.anders {
font-stretch : wider;
font-weight : bold;
}

BODY.backtop
{
background-image : url(../images/oben.jpg);
background-repeat : no-repeat;
}

BODY.backleft{
background-image : url(../images/links.jpg);
background-repeat : no-repeat;
background-attachment : fixed;
}

BODY.backmain {
background-image : url(../images/erweiterung.jpg);
background-repeat : no-repeat;
background-attachment : fixed;
background-position : 25px;
}

.heading {
font-family : Arial, Helvetica, sans-serif;
font-size : 16px;
color : #00008B;
font-weight : bold;
background-color : transparent;
}

DIV.titel {
font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size : 26px;
color : #FFFFFF;
margin-left : 170px;
margin-top : 45px;
white-space : nowrap;
background-color : transparent;
}

.indexlogo {
height : 80%;
text-align : center;
width : 100%;
}

.indexschrift1 {
font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
color : Gray;
font-size : 16px;
background-color : transparent;
}

.indexschrift2 {
font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
color : #A9A9A9;
font-size : 12px;
background-color : transparent;
}
 
welchen IE benutzte denn? Benutze 6.0
Das kann doch nicht sein...?
Kann ich dir mal alles per Mail zukommen lassen?
DANKE!
P.S. Ist ganz wichtig weil Semesterarbeit für Uni...muss dringend laufen und natürlich eigentlcih schon gestern...du verstehst..;-)
 
IE5 , IE5.5 und IE6 machen das bei mir fehlerfrei.(MAC-IE konnt ich leider nicht testen, den MAC hat mein Wellensittich gefressen:))

Du kannst das ganze übrigens auch als ZIP verpacken und an deinen Beitrag dranhängen;)(geht allerdings nicht, wenn du die Schnellantwort-Box benutzt)
 
Zurück