Bildervorschau

[BigManu]

Hallo,

wäre super nett, wenn mir einer beim folgenden Code helfen könnte, den auch für FireFox kompatibel zu machen. Im IE läuft der wunderbar...!

function showPic(source)
{
	if(document.getElementById("picpreview"))
	{
		var sourcePic = document.getElementById("picpreview");
		if(source)
		{
			fileextension=source.substring(source.lastIndexOf(".")+1);
			if(fileextension.toLowerCase() != "jpg" && fileextension.toLowerCase() != "jpeg" && fileextension.toLowerCase() != "gif")
			{
				var errormsg = "Bitte wählen Sie eine Bilddatei aus.";
				alert(errormsg);
				document.getElementById("picpreview").value = "";
				document.getElementById("picpreview").src = "";
				return false;
			}
			else
			{
				document.getElementById("picpreview").src = source;
				return true;
			}
		}
		else
		{
			return;
		}
	}
	else
	{
		return;
	}
}

und im body...

[img]./images/blank.jpg[/img]

<input type="file" name="newpic" id="sourcePic" onChange="showPic(this.value);" style="border: 1px solid #850D0E">

Wäre super, wenn einer eine Lösung parat hätte!!!
Danke im Vorraus!

DOM syntax sollte helfen

bsp.

var imgArray = new Array();
imgArray = ("bild.x","bild.y" .... )

var oldImage = window.document.images[0].src
window.document.images[0].src="bild.jpg" // neu zugewiesen

sollte es sich nur um bilder handeln dann wäre diese syntax angebracht

Js version ab 1.1
Netscape ab version 3.
IE ab version 4.


edit:
if(document.getElementById("picpreview"))

wenn dann
if (document.getElementById) {
wobei immo IE und FF die gleiche syntax in diesem fall nutzen

eine funktion für crossbrowser wäre etwa so

function getById(idname) {
  if (typeof(objects[idname]) == "undefined") {
    if(document.getElementById) {
      objects[idname] = document.getElementById(idname);
    } else if (document.layers) {
      objects[idname] = document.layers[idname];
    } else if (document.all) {
      objects[idname] = document.all[idname];
    }
  }
  return objects[idname];
}

[BigManu]

Wie soll denn diese Zeile mein Bild ändern???

window.document.images[0].src=source;

Verstehe nicht ganz, wie ich damit auf den <img> tag zugreife...

window.document.images[0]

images enthält ein array der image tags in deinem document

um zu testen einfach

for (var i in window.document.images) {
alert(window.document.images[i].src);
}

----
die funktion ala
function getById(idname) { .....

var imgObj = getById("picpreview");
alert(imgObj.src);

[XLB]

Dein Code ist "grundsätzlich" auch mit dem FF kompatibel.

Aber : Der FF und andere "echte" Browser weigern sich standhaft , auf das lokale Filessystem des Client zuzugreifen und das ist auch gut so. Das der IE mal eben von der Platte des Users Daten (hier : Bilder) liest, spricht nicht gerade für ihn ...

Um zu demonstrieren, dass dein Code "richtig" ist, könntest du z.B. zu "Debug"-Zwecken mal ein "alert()" in das "else"-Konstrukt basteln ...

   ...

   else
         {
            document.getElementById("picpreview").src = source;

            alert('Source:'+document.picpreview.src);

            return true;
         } 
   ...

... und das ganze mal auf dem FF starten. Dem Bild "picpreview" wird die neue Ressource erfolgreich zugewiesen und trotzdem wird das Bild (ausser im IE) nicht dargestellt.

Nebenbei bemerkt, erwartet der FF bei einem Zugriff auf's lokale Filesystem ein "file:///" vor der Pfadangabe. Doch selbst dann erhälst du diese alles klärende Fehlermeldung (vorausgesetzt du hast die JS-Konsole geöffnet) :

Sicherheitsfehler: Inhalt auf http://localhost/X.php darf file:///X.jpg nicht laden oder verlinken.

[BigManu]

das heißt ich habe letztendlich überhaupt keine chance die bildervorschau für den FF kompatibel zu machen?

[XLB]

Jau, das heist das ...

Allerdings ist dies keine Frage der Kompatibilität, denn der Code ist ja "grundsätzlich" OK., sondern der Art und Weise, wie konsequent sich die Browser um gewisse Sicherheitsaspekte (im Interesse der User) scheren ... - das sich der IE in der Hinsicht als äusserst "defizitär" erweist und seine eigenen Wege geht ist ja nix neues.

Gruß,
Axel

[BigManu]

hm naja ok... dann bedanke ich mich herzlich für eure antworten!!!