Funktion dynamisch machen mit Fehlern

[Carola Hensch]

Hallo,

ich möchte die Größe eines IFrames immer automatisch dem jeweiligen Content darin anpassen lassen.

Dazu gibt es dieses schöne Script, was man auf der Seite plaziert wo der IFrame eingebunden wird. Im IFrame selbst muss dann direkt nach dem BODY-Tag ein DIV-Tag namens "cont" rein.

Der IFrame sieht so aus:

<iframe src="profil.php" onLoad="pruefe()" width="500" height="500" id="profil">

function pruefe() {  
if(document.all&&!window.opera) {  
var a=document.all.profil;  
profil.document.body.scroll='no';  
} else {  
var a=document.getElementsByName('profil')[0];  
a.scrolling='no';  
}  
var a=document.getElementsByName('profil')[0];  
profil.document.getElementsByTagName('body')[0].style.overflow='hidden';  
var b=profil.document.getElementById('cont');  
if(a.style.height != eval(b.offsetHeight+35)+'px') {  
a.style.height=eval(b.offsetHeight+35)+'px';  
}  
}  

Das funktioniert einwandfrei für den IFrame namens "profil".

Nun möchte ich aber diese Funktion für mehrere IFrames nutzen und habe daher der Funktion eine Variable gegeben:

function pruefe(was) {  
if(document.all&&!window.opera) {  
var a=document.all.was;  
was.document.body.scroll='no';  
} else {  
var a=document.getElementsByName(was)[0];  
a.scrolling='no';  
}  
var a=document.getElementsByName(was)[0];  
was.document.getElementsByTagName('body')[0].style.overflow='hidden';  
var b=was.document.getElementById('cont');  
if(a.style.height != eval(b.offsetHeight+35)+'px') {  
a.style.height=eval(b.offsetHeight+35)+'px';  
}  
}  

Der IFrame sieht nun so aus:

<iframe src="profil.php" onLoad="pruefe('profil')" width="500" height="500" id="profil">

Nun meldet er mir in der Fehlerkonsole:

Fehler: was.document is undefined

Das Script auch funktioniert nicht mehr.

Hab ich die Variable in der neuen Funktion irgendwie falsch eingefügt?

Danke,
Carola Hensch

[LX]

In JavaScript Instanzen und Methoden eines Objekts dynamisch zu referenzieren, geht so:

function(methode) {  
   return objekt[methoden]  
}

document.all.was gibt nur das Element mit der ID "was" zurück.

Gruß, LX

[molily]

function pruefe() {
if(document.all&&!window.opera) {

Das (DOM-Modell von IE 4-5) kannst du im Jahr 2009 weglassen und auf das W3C DOM setzen.

var a=document.all.profil;
profil.document.body.scroll='no';
} else {
var a=document.getElementsByName('profil')[0];

Nutze besser eine ID für das IFrame und dann getElementById.

a.scrolling='no';
}
var a=document.getElementsByName('profil')[0];

Wieso wiederholst du die Abfrage hier.

profil.document.getElementsByTagName('body')[0].style.overflow='hidden';

Auch hier ist getElementsByTagName unnötig, nutze .document.body.

Beziehungweise: Wenn du auf das document-Objekt des Dokuments im Iframe zugreifen willst, geht das nicht in allen Browser mit .document. Sondern eher so http://xkr.us/articles/dom/iframe-document/

var b=profil.document.getElementById('cont');
if(a.style.height != eval(b.offsetHeight+35)+'px') {
a.style.height=eval(b.offsetHeight+35)+'px';

eval ist hier unnötig und macht das ganze unnötig langsamer.

Warum nicht einfach so:

function iframe_höhe_anpassen (id)
   var iframe = document.getElementById(id);
   iframe.scrolling = "no";
   // Browserübergreifend auf das Dokument im Iframe zugreifen
   if (iframe.contentDocument) {
      var iframe_document = iframe.contentDocument;
   } else if (iframe.contentWindow) {
      var iframe_document = iframe.contentWindow.document;
   } else {
      return;
   }
   iframe_document.body.scroll = "no";
   iframe_document.body.style.overflow = "hidden";
   // Inwiefern die beiden vorigen nötig sind, weiß ich nicht, aber ich nehme mal an, du weißt es.
   iframe.style.height = iframe_document.offsetHeight + 35 + 'px';
}

iframe_höhe_anpassen("iframe-id");

Mathias