Avatar billede joeblack Nybegynder
08. februar 2011 - 11:16 Der er 10 kommentarer og
1 løsning

Display='none' på alle divs virker ikke

Hej eksperter !

Nu gider jeg ikke stirre mig blind på det længere....!

Jeg har et script, der sætter display:'none' på alle åbne divs:

var oActive = null;
function ShowHideContent(divID)
{
    var oDiv = document.getElementById(divID);
    if (oActive) oActive.style.display = 'none';
    if (oDiv==oActive) return oActive = null;
    oActive = oDiv;
    oActive.style.display = 'block';
}

Jeg bruger sommetider et andet til at åbne nogle af dem (når jeg ikke vil lukke andre):

function Toggle(id) {
    var state = document.getElementById(id).style.display;
        if (state == 'block') {
            document.getElementById(id).style.display = 'none';
        } else {
            document.getElementById(id).style.display = 'block';
        }
    }

Nu er problemet, at "ShowHideContent" ikke lukker dem, jeg har åbnet med Toggle - ved nogen hvorfor ???

/Frederik
Avatar billede jakobdo Ekspert
08. februar 2011 - 11:28 #1
Bruger du evt. firefox ?
Hvis ja, smid firebug på og fejlsøg den vej?
Bliver display rent faktisk sat til block / none osv.. ?
Avatar billede joeblack Nybegynder
08. februar 2011 - 11:32 #2
Hej Jakob

Nej, jeg bruger IE

"Bliver display rent faktisk sat til block / none osv.. ? " Tja, umiddelbart vises og lukkes divs fint - altså bortset fra, når jeg så vil lukke dem, der er åbnet med Toggle.
Avatar billede softspot Forsker
08. februar 2011 - 11:35 #3
Og hvis du kører IE8, kan du hive debuggeren frem med F12 ;-)

Anyway! Prøv evt. med nedenstående rettelse:

function Toggle(id) {
    var state = document.getElementById(id).style.display;
        if (state != 'none') {
            document.getElementById(id).style.display = 'none';
        } else {
            document.getElementById(id).style.display = 'block';
        }
    }
Avatar billede intenz Novice
08. februar 2011 - 11:42 #4
ShowHideContent bruger en variabel (oActive) til at 'lukke' den seneste åbnede div. Toggle opdaterer ikke denne variablen, derfor har ShowHideContent ikke noget at lukke.

Du kan gemme den i din Toogle funktion.

function Toggle(id) {
    var state = document.getElementById(id).style.display;
        if (state == 'block') {
            document.getElementById(id).style.display = 'none';
        } else {
            oActive = document.getElementById(id);
            oActive.style.display = 'block';
        }
    }


Det vil dog aldrig virke hvis du bruge Toogle på flere divs inden du kører ShowHideContent. Så vil den kun lukke den seneste, da variablen kun kan indeholde en værdi.
Avatar billede joeblack Nybegynder
08. februar 2011 - 11:46 #5
Hej softspot

Sorry, jeg kender ikke debuggeren :-(

Anyway, den foreslåede rettelser virker ikke. Det er nu heller ikke Toggle-funktionen der driller. Det er ShowHideContent, der starter med at lukke dem, der er åbnet med Toggle...giver det mening ?
Avatar billede joeblack Nybegynder
08. februar 2011 - 11:48 #6
Hej intenz

OK, det giver mening.

Hvordan kan gøre, så jeg lukker alle åbne divs og åbner den jeg trykket på ?
Avatar billede intenz Novice
08. februar 2011 - 11:59 #7
Du skal bruge et array i stedet for en variablen.

Prøv denne (ikke testet):

var oActive = [];
function ShowHideContent(divID) {
    var oDiv = document.getElementById(divID);
    if (oActive.length > 0) {
        // lukke alle divs i array
        for (var i=0; i<oActive.length; i++) {
            oActive[i].style.display = 'none';
        }
        // nulstille array
        oActive = [];
    }
   
    // tilføje ny div til array
    oActive.push(oDiv);

    // åbne ny div
    oActive.style.display = 'block';
}

function Toggle(id) {
    var div = document.getElementById(id);
    var state = div.style.display;
    if (state == 'block') {
        // fjerne denne div fra array
        var newArray = [];
        for(var i=0; i<oActive.length; i++) {
            if (oActive[i] != div) {
                newArray.push(oActive[i]);
            }
        }
        oActive = newArray;

        // skjul div
        document.getElementById(id).style.display = 'none';
    } else {
        // tilføj div til array og vis
        oActive.push(div);
        document.getElementById(id).style.display = 'block';
    }
}
Avatar billede jakobdo Ekspert
08. februar 2011 - 12:03 #8
Og i stedet for at rode så meget med js, så overvej evt. at kigge på libs ala jquery, prototype etc.
Avatar billede joeblack Nybegynder
08. februar 2011 - 12:21 #9
@intenz -> Det virker ikke :-(
Avatar billede intenz Novice
08. februar 2011 - 12:51 #10
Ah, der var en skrivefejl.

Ret i ShowHideContent

    // åbne ny div
    oActive.style.display = 'block';


til:

    // åbne ny div
    oDiv.style.display = 'block';
Avatar billede joeblack Nybegynder
08. februar 2011 - 13:47 #11
Perfekt. Takker mange gange !
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester