Firefox en getElementById

[Verwijderd]

Heb een probleem wat wel werkt in IE maar niet in firefox 1.0

Ja ik heb al veel gezocht en al uren mee bezig en dacht dat het iets te maken had met getElementById en/of document.all
Echter heb ik totaal geen verstand van javascript en kom er niet uit.
Krijg verder geen foutmeldingen in firefox.

Voorbeeld bij het klikken op Henk:

Henk
  Naam: Dhr. Henk
  Adres: blablaweg 1
  Plaats: Eindhoven
Piet
Greet


Het gaat om de volgende 2 stukjes waarbij het klikken op de link zou moeten zorgen voor een uitklap gedeelte.

code:

<script language="javascript">
/* voor het uitklappen van de contents */
var ns6=document.getElementById&&!document.all?1:0

var head="display:''"
var folder=''

function expandit(curobj){
    folder=ns6?curobj.nextSibling.nextSibling.style:document.all[curobj.sourceIndex+1].style
    if (folder.display=="none")
        folder.display=""
    else
        folder.display="none"
}
</script>

code:

print "<tr><td><font style='cursor:hand' onClick='expandit(this)'>".$row->$mainrecord ."</font><span style='display:none' style=&{head};><br><table>";

[Johnny]

Ik snap niet wat je nu precies zit te prutsen, maar je code is behoorlijk ranzig.

code:

<script type="text/javascript">

function hide(id) {
document.getElementById(id).style.display = 'none';
}


function show(id) {
document.getElementById(id).style.display = 'block';
}

</script> 

<a href="javascript:show('mijnKlapDing')">show</a>  - <a href="javascript:hide('mijnKlapDing')">hide</a>

<div id="mijnKlapDing">
inhoud
</div>

[ Voor 18% gewijzigd door Johnny op 10-11-2004 18:57 ]

[Verwijderd]

Dat bedoelde ik niet helemaal.
Jij had 1 link waarbij alles 'hide' of 'show' zou zijn.
Ging me meer per link.

Maar inmiddels opgelost met het script van:
http://www.dynamicdrive.com/dynamicindex1/navigate1.htm

[Fuzzillogic]

Damn, die link laat mijn Opera op zijn bek gaan

Anyway, vergeet document.all. Dat is ranzig, vies, smerig en bah, en niet te vergeten niet volgens de o-zo-belangrijke W3C-specs. getElementById wordt ondersteund in elke niet-fossiele browsers.

En wees ook spaarzaam met gebruik van scriptjes van dergelijke sites. Mijn ervaring is dat er veel oude troep bij zit, welke m.b.v. browser-sniffing allemaal rare fratsen gaat uithalen. En wil je nou nog werkelijk NS4 ondersteunen?...

[addon]Net even met gecko naar dat script gekeken. Aarg! Serieus, doe de wereld een lol en gebruik dat soort verouderd spul niet. Johnny heeft net al een prima oplossing gegeven.[/addon]

[ Voor 20% gewijzigd door Fuzzillogic op 11-11-2004 20:27 . Reden: addon toegevoegd ]

[JeromeB]

Nexxennium schreef op 11 november 2004 @ 20:23:
Anyway, vergeet document.all. Dat is ranzig, vies, smerig en bah, en niet te vergeten niet volgens de o-zo-belangrijke W3C-specs. getElementById wordt ondersteund in elke niet-fossiele browsers.

offtopic:
Wat heeft het W3C hier mee te maken en over welke specs heb je het?

[Barracuda_82]

Ik heb laatste een zelfde soort script in elkaar gezet. Klapt automatisch in en uit, aan de hand van de huidige staat. Ook gebruik ik een leuk plaatje met een plusje en een minnetje die veranderd bij het in- en uitklappen.

Dit zijn de plaatjes:


In de header:

code:

function showOptions(nr) {
     if (document.getElementById('options'+nr).style.display == "none") {
        document.getElementById('options'+nr).style.display = "block";
        document.getElementById('opt_img'+nr).src = "img/min.gif";
     } else {
        document.getElementById('options'+a).style.display = "none";
        document.getElementById('opt_img'+nr).src = "img/plus.gif";
     }
}

Als linkje:

code:

<a href="javascript: void();" onclick="javascript: showOptions(1);">
[img]"img/plus.gif"[/img] klikkerdeklik
</a>

En het divje dat uitgeklapt word:

code:

<div id="options1" style="display: none; ">BLAAAAT</div>

Dit zou je in jouw geval dus zo op kunnen lossen:

code:

<a href="javascript: void();" onclick="javascript: showOptions(1);">[img]"img/plus.gif"[/img] Henk</a>
<div id="options1" style="display: none; ">Naam: Dhr. Henk<br>Adres: blablaweg 1<br>Plaats: Eindhoven</div>
<a href="javascript: void();" onclick="javascript: showOptions(2);">[img]"img/plus.gif"[/img] Piet</a>
<div id="options2" style="display: none; ">Naam: Dhr. Piet<br>Adres: blablaweg 1<br>Plaats: Den Bosch</div>
<a href="javascript: void();" onclick="javascript: showOptions(3);">[img]"img/plus.gif"[/img] Kees</a>
<div id="options3" style="display: none; ">Naam: Dhr. Kees<br>Adres: blablaweg 1<br>Plaats: Oss</div>

Het lijkt een beetje onoverzichtelijk, maar copy-paste het eens en speel er eens mee. Ik heb zelf overal variabelen gebruik (options1, options2, etc) omdat bij mij alles door een PHP script gegenereerd word en een paar honderd van die dingen op een pagina weer moet geven. Word een beetje lastig als je dat allemaal met de hand in moet voeren.

Ik hoop dat je er iets aan hebt. Succes ermee.

edit:

Dit komt in grote lijnen overeen met het scriptje van Johnny, maar ik wilde het toch graag even met je delen.

[ Voor 19% gewijzigd door Barracuda_82 op 11-11-2004 21:50 ]

[Fuzzillogic]

JeromeB schreef op 11 november 2004 @ 21:22:
[...]

offtopic:
Wat heeft het W3C hier mee te maken en over welke specs heb je het?

offtopic:
document.all is geen onderdeel van de W3C DOM-specificaties. Het is ook nergens meer nodig voor tegenwoordig. IE5+ en alle andere moderne browsers ondersteunen gewoon getElementById.

Dit soort dingen kun je ook met CSS2 en de :focus selector oplossen.

code:

<style type="text/css">
div.naam div.adres {
    display: none;
}

div.naam:focus div.adres {
    display: block;
}

</style>

...

<div class="naam">
henk
<div class="adres">
Koestraat 3
7822 MB Boerendam
</div>
</div>

Untested Werkt niet in IE, wegens de brakke CSS2-support. Maar met IE7 zou dat ook gefixt moeten kunnen worden.