• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

innerHTML zw.speichern

Status
Für weitere Antworten geschlossen.
S

switch

Neues Mitglied
Hallo, ich möchte eine Art Klappmenü basteln, bei dem bei Klick auf ein Tabellenfeld ein anderes mit samt Inhalt verschwindet und bei nochmaligem Klick wieder mit Inhalt erscheint. "Klappen" tut es zwar, aber der Inhalt erscheint beim zweiten Klick nicht - nur ein "undefined".

Abgespeichert habe ich den Inhalt mit
Code: 
var inhalt=document.getElementById('feld').innerHTML;
.

Per
Code: 
document.getElementById('feld').innerHTML=inhalt;
soll er wieder erscheinen - stattdessen ein "undefiniert".


Ist das Abspeichern so korrekt, oder woran könnte es liegen?



VG
 
Werbung:
Es liegt daran, dass die Variabel "inhalt" den Wert undefined hat. Aber warum blendest du nicht einfach den Inhalt per CSS aus und wieder ein?
 
struppi schrieb:
Es liegt daran, dass die Variabel "inhalt" den Wert undefined hat. Aber warum blendest du nicht einfach den Inhalt per CSS aus und wieder ein?
Zum Vergrößern anklicken....

Ich dachte mir schon, dass die Variable "inhalt" leer ist. Die Frage ist warum. Warum wird beim ersten Schritt nicht gespeichert bzw. der Wert nicht gehalten?

Meine Test-Seite habe ich mal hochgeladen: http://wp1008827.wp013.webpack.hosteurope.de/test.htm

JS:
Code: 
k=0;
var inhalt=document.getElementById('feld').innerHTML;
var inhalt2=document.getElementById('feld2').innerHTML;
var content=0;

function test(id){

    if(id=="feld"){
        content=inhalt;
    }else{
        content=inhalt2;
    }
    if(k==0){
        for(i=200;i>=0; i--){
            document.getElementById(id).innerHTML="";
            window.setTimeout("document.all."+id+".style.height="+i,10);
            k=1;
        }
    }else{
        for(i=0;i<=200; i++){
            window.setTimeout("document.all."+id+".style.height="+i,10);
            document.getElementById(id).innerHTML=content;
        }
        k=0;
    }
}
Eine andere Frage am Rande wäre noch, wieso das Timeout nicht läuft. Eigentlich sollen die Klappen Pixel für Pixel hoch- bzw. runterklappen. Leider wird erst die angegebene Zeit gewartet und das Menü klappt dennoch sprunghaft nach oben bzw. unten.

Wenn der Teil des Löschens mit CSS besser läuft, gib mir bitte noch einen Link dazu, da ich hier nicht so bewandert bin. Danke!


s.
 
Werbung:
Du solltest als erstes dich mit dem Umgang der Fehlerkonsole vertraut machen, dann wärst du schon einen Schritt weiter. Wenn du den Inhalt lesen willst, dann existiert das Element noch nicht (und erzeugt eine Fehlermeldung).

Das zweite was du vorhast, um die Höhe eines Elements "fliessend" zu ändern geht so nicht.

Hier mal ein Vorschlag (wobei es schöner aussieht wenn du einen Tween Effekt verwendest):
Code: 
<!doctype html>
<html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#test {
    position:absolute;
    height:0;
    width:100px;
    background-color:red;
    overflow:hidden;
}
</style>
</head>
<body>
<span onclick="toogle('test')">klick</span>
<div id="test">Test Element </div>

<script type="text/javascript">

/*
    Erweiterung von Function
*/
Function.prototype.Timer = function (interval, anzahl, endFunction) {
    if(!anzahl || anzahl < 0 ) anzahl = 0;
    var count = 0;
    var _this = this;
    
    (function f() {
        if (count < anzahl  && _this(++count, anzahl) != false) {
            window.setTimeout(f, interval);
        } else {
            if (endFunction) endFunction();
    }
  })();
};

function toogle(id){
    var el = document.getElementById(id);
    if(!el)return;
    var h = parseInt(el.style.height, 10) || 0;
    var offen;
    var func = function (c){
        el.style.height = Math.abs(c * 2 - h) + 'px';
        offen = Math.abs(c * 2 - h) == 100;
    };
    func.Timer(1, 100 / 2, function() { alert('Das Fenster ist ' + (offen ? 'offen': 'zu')); });
}
</script>
</body>
</html>
 
Es ist im Grunde ganz einfach, wieso die Variable "inhalt" leer "bleibt".
document ist ein Objekt, das heißt es wird nicht kopiert, sondern referenziert. Das heißt wenn du "inhalt" eben innerHTML zuweist, verweist "inhalt" nur auf innerHTML, den du ja allen Anschein nach leerst, somit bleibt "inhalt" nicht leer, sondern wurde automatisch mitgeleert. Ich weis nicht mehr, wie man eine Eigenschaft kopiert, google eventuell einfach mal nach Objekte kopieren. Es gibt nen Haufen Workarounds wie man ein Objekt kopiert, die bei mir allerdings allesamt nicht 100% funktioniert haben, vielleicht hast du da mehr Glück. :)

MfG,
DarkDragon-1993
 
DarkDragon193 schrieb:
Es ist im Grunde ganz einfach, wieso die Variable "inhalt" leer "bleibt".
Zum Vergrößern anklicken....
Ja, weil zu dem Zeitpunkt wo er auf das Element zugreift, es noch nicht existiert, das ist auch genau das was in der Fehlermeldung steht. Deine Erklärung ist falsch, da innerHTML kein Objekt ist, sondern ein String.
 
Werbung:
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben