Array.length funktioniert nicht (array.length = undefined)

[Core]

Hi Leute,
ich bin ein Javascript-Anfänger und spiele mich gerade mit jQuery
und meinm Versuch YouTubefilme - in Bilder um zu wandeln um sie
per div (contentEditable) herum verschieben zu können.
Nein - Ich möchte keinen WYSIWYG-Editor verwenden :)

  
			$(document).ready(function() {  
			  
							  
					  var $flag = true;  
					  var $video_array = new Array();  
					  
					  $("#hideButton").click(function(flag) {  
								  
								if ($flag){  
									  
										$("#div1").show("slow", function() {});  
										$flag = false;  
										  
								} else {  
									  
										$("#div1").hide("slow", function() {});  
										$flag = true;  
								}  
								  
					  });  
					  
					  
					  
					  $('#youtube_add').click(function($video_array){  
								  
									$video_link = $('#youtube_link').val();  
	  
									  
									$position 	 = $video_link.indexOf("width");  
									$video_width  = $video_link.substring($position+7, $position+10);  
									  
									$position 	 = $video_link.indexOf("height");  
									$video_height = $video_link.substring($position+8, $position+11);  
									  
									  
									$img		   = document.createElement('img');  
									$img.src       = "#";  
									$img.width 	   = $video_width;  
									$img.height    = $video_height;  
									$img.id 	   = "video" + $video_array.length;  
									  
									var $a_index = $video_array.length;  
									$video_array[$a_index] = new Array();  
									$video_array[$a_index]['video'] = $video_link;  
									$video_array[$a_index]['id'] 	 = $img.id;  
									  
									  
									$('#youtube_link').val("");  
									$('#divtest').append($img);  
									$("#div1").hide("slow", function() {});  
									$flag = true;  
									  
									  
									  
					  });  
					  
					  
					  
					  
					  onsubmit = function ($video_array){  
								  
										  
									$test = $('#divtest').html();  
									  
									alert('Submit');  
									console.log($video_array.length);  
									return false;  
									  
									for (i = 0; i < $video_array.length; i++){  
									  
												$alert(i);  
										  
									}  
									  
									$('#divtest').append ("<textarea name='text'>"+test +"</textarea>");  
									return false;  
									  
								  
					   }  
					  
					  
			});  

Mein erstes Problem war dass ich:
"$a_index = $video_array.length;" erstellen musste da ich sonst nicht
das Array variable zu seiner Größe befüllen konnte! Woher kommt das?
Warum ging $video_array[$video_array.length] = new Array(); nicht?

Und meine zweite Frage ist:
Warum ist die $video_array.length in der submit funktion undefiniert?

Hoffe ihr könnt mir helfen.

[hotti]

hi,

vielleicht hilft Dir dieser Hinweis: array.length ist keine Funktion sondern eine Eigenschaft. JS betrachtet u.a. auch Zeichenketten als Array.

Hotti

[LX_unangemeldet]

Hi, Core!

Wie kommst Du darauf, dass der onclick- bzw. onsubmit-Handler der jeweiligen Funktion das Array automatisch übergibt, nur weil dessen Name bekannt ist?

Diese Handler-Funktionen bekommen als erstes Argument das Event-Objekt (außer im IE, wo es in window.event gespeichert ist). Du musst also function() ohne Argumente nehmen, wenn Du möchtest, dass die Funktionen auf das Array zugreifen können.

Gruß, LX

[Core]

Danke euch für die Hilfe.
Funktioniert Perfekt!

[molily]

[code lang=javascript]
$(document).ready(function() {

  			  var $flag = true;  
  			  var $video\_array = new Array();  

Wieso fangen die Namen deiner Variablen mit »$« an? Das ist nicht PHP.

Ich kenne diese Konvention nur, wenn man jQuery-Objekte kennzeichnen will. Diese Variablen sind aber keine jQuery-Objekte.

$("#div1").show("slow", function() {});

Wenn du eine leere Funktion als Callback übergibst, kannst du auch keine Funktion übergeben.

$('#youtube_add').click(function($video_array){

Du notierst hier eine Closure. Sie hat automatisch Zugriff auf die Variable $video_array aus dem Scope der äußeren Funktion. Wenn du sie in dieser Handlerfunktion als Parameter deklarierst, hast du auf die Variable der äußeren Funktion keinen Zugriff mehr.

Wie gesagt bekommen Event-Handler-Funktionen als ersten Parameter das Event-Objekt.

$img.src       = "#";

Diese Zeile kannst du dir vermutlich sparen - welchen Zweck soll sie erfüllen?

$a_index = $video_array.length;
$video_array[$a_index] = new Array();
$video_array[$a_index]['video'] = $video_link;
$video_array[$a_index]['id'] = $img.id;

Du programmierst JavaScript wie PHP. Bitte setze dich einmal mit JavaScript auseinander. Du machst gleich mehrere Sachen hier falsch bzw. könntest vieles verbessern.

1. JavaScript ist objektorientiert.
2. Es gibt in JavaScript <http://de.selfhtml.org/javascript/objekte/array.htm#assoziative_arrays@title=keine assoziativen Arrays>.
3. Arrays sind zwar auch Objekte, aber wenn du nur einen Hash brauchst, dann verwende ein Object.
4. Objects kannst du mit dem Object-Literal { ... } erzeugen, Arrays mit dem Array-Literal [ ... ].
5. Wenn du Elemente an einen Array hängen willst, dann nutzt du die http://de.selfhtml.org/javascript/objekte/array.htm#push@title=push-Methode eines Array-Objekts.
6. Auf die Eigenschaften von Objekten kannst du einfach mit objekt.eigenschaft zugreifen. objekt['eigenschaft'] ist zwar äquivalent, aber unnötig kompliziert.

Kurz gesagt, in JavaScript würde man das so schreiben:

$video_array.push({
   video : $video_link,
   id : $img.id
});

onsubmit = function ($video_array){

Was ist onsubmit? Wohin löst dieser Bezeichner auf? Woher kommt diese Variable?
Wenn du keine solche Variable deklariert hast, wird JavaScript eine globale Eigenschaft window.onsubmit erzeugen.
Beim Absenden eines Formulars wird beim zugehörigen form-Element ein submit-Ereignis erzeugt, aber dieses steigt nicht auf. Du müsstest es also beim
form-Element direkt überwachen, falls du das beabsichtigst.

"$a_index = $video_array.length;" erstellen musste da ich sonst nicht
das Array variable zu seiner Größe befüllen konnte! Woher kommt das?

Du kennst push nicht.

Warum ging $video_array[$video_array.length] = new Array(); nicht?
Warum ist die $video_array.length in der submit funktion undefiniert?

Weil du die Variable in der inneren Funktion neu deklarierst und somit keinen Zugriff auf die gleichnamige Variable in der äußeren Funktion mehr hast.

Mathias

[MudGuard]

Hi,

$img.src       = "#";
Diese Zeile kannst du dir vermutlich sparen - welchen Zweck soll sie erfüllen?

Das img-Element hat dann ein nicht-darstellbares Bild (die HTML-Datei ist ja kein Bild) als src.

Der Zweck ist somit klar: der alt-Text soll angezeigt werden ... ;-)

cu,
Andreas