[JavaScript] document.getElementById - Softwareontwikkeling

maandag 27 december 2004 18:12

Acties:

Verwijderd

Topicstarter

Het volgende stuk code doet het wel in Mozilla maar niet in Internet Explorer. Heeft iemand enig idee waarom:

JavaScript:

var pos=0;

var bestanden=new Array("DSC01297.JPG","DSC01298.JPG","DSC01299.JPG","DSC01301.JPG","DSC01302.JPG","DSC01305.JPG",
"DSC01306.JPG","DSC01307.JPG","DSC01308.JPG","DSC01309.JPG","DSC01310.JPG","DSC01311.JPG","DSC01312.JPG",
"DSC01313.JPG","DSC01314.JPG","DSC01315.JPG","DSC01316.JPG","DSC01317.JPG","DSC01318.JPG","DSC01319.JPG",
"DSC01321.JPG","DSC01322.JPG","DSC01323.JPG","DSC01324.JPG","DSC01326.JPG","DSC01327.JPG","DSC01328.JPG",
"DSC01329.JPG","DSC01330.JPG","DSC01331.JPG","DSC01333.JPG","DSC01336.JPG","DSC01337.JPG","DSC01338.JPG",
"DSC01347.JPG","DSC01348.JPG","DSC01349.JPG","DSC01350.JPG","DSC01351.JPG","DSC01352.JPG","DSC01353.JPG",
"DSC01354.JPG","DSC01355.JPG","DSC01356.JPG","DSC01358.JPG","DSC01360.JPG","DSC01361.JPG","DSC01362.JPG",
"DSC01364.JPG","DSC01365.JPG","DSC01366.JPG","DSC01367.JPG","DSC01369.JPG","DSC01370.JPG","DSC01371.JPG",
"DSC01372.JPG","DSC01373.JPG","DSC01374.JPG");


function scroll_rechts()
{
    if(pos>=bestanden.length-4) return 0;
    else
    {
        pos++;
        t1=document.getElementById("t1");
        t2=document.getElementById("t2");
        t3=document.getElementById("t3");
        t4=document.getElementById("t4");
        t1.src="images/Polo/thumbs/"+bestanden[pos];
        t2.src="images/Polo/thumbs/"+bestanden[pos+1];
        t3.src="images/Polo/thumbs/"+bestanden[pos+2];
        t4.src="images/Polo/thumbs/"+bestanden[pos+3];
    }
}
        
function scroll_links()
{
    if(pos<=0) return 0;
    else
    {
        pos--;
        t1=document.getElementById("t1");
        t2=document.getElementById("t2");
        t3=document.getElementById("t3");
        t4=document.getElementById("t4");
        t1.src="images/Polo/thumbs/"+bestanden[pos];
        t2.src="images/Polo/thumbs/"+bestanden[pos+1];
        t3.src="images/Polo/thumbs/"+bestanden[pos+2];
        t4.src="images/Polo/thumbs/"+bestanden[pos+3];
    }
}

function show_foto(i)
{
    document.getElementById("foto").src="images/Polo/"+bestanden[pos+i];
}

Hij gaat de fout in bij scroll_links() en scroll_rechts() bij de 2e document.getElementById("t2"); (regels 21 en 38) volgens IE. Onder Mozilla werkt het perfect.

maandag 27 december 2004 18:20

Acties:

crisp

Devver

Pixelated

Lastig te zeggen zonder een stukje relevante markup.
Verder hoort clientside javascript in Webdesign & Graphics

P&W --> W&G dus

Intentionally left blank

maandag 27 december 2004 18:23

Acties:

pjonk

Zonder de relevante HTML code en de exacte foutmelding kunnen wij hier weinig zinnigs over zeggen. Overigens zou je dit topic beter in "Webdesign & Graphics" plaatsen aangezien het over JavaScript gaat.

It’s nice to be important but it’s more important to be nice

maandag 27 december 2004 18:35

Acties:

Verwijderd

Topicstarter

Dit is de HTML code. t1-t4 zijn thumbnail waardoor als je erop klikt een grote versie in de tabel-rij boven te zien krijgt.Foutmelding die die geeft is "Deze eigenschap of methode wordt niet ondersteund door dit object" op regel 21.

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Polo Foto's</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="style/style.css" type="text/css" rel="stylesheet">
<script language="javascript 1.4" type="text/javascript" src="scripts/fotos.js"></script>
</head>

<body>
<table align="center" style="background-color:green; border:green 3px">
<tr><td width="660" height="420" align="center">[img]"images/Polo/DSC01297.JPG"></td>
<tr[/img]
<td align="center">
[img]"images/links.gif"[/img]
[img]"images/Polo/thumbs/DSC01297.JPG"[/img]
[img]"images/Polo/thumbs/DSC01298.JPG"[/img]
[img]"images/Polo/thumbs/DSC01299.JPG"[/img]
[img]"images/Polo/thumbs/DSC01301.JPG"[/img]
[img]"images/rechts.gif"[/img]</td>
</tr>   

</table>
</body>
</html>

maandag 27 december 2004 18:44

Acties:

crisp

Devver

Pixelated

Het is een namespace probleem: IE gooit alles met een ID in de global namespace - erfenisje van het eeuwig backwardscompatible blijven (document.all object model).
Oplossing: zorg dat je variabelen t1, t2, t3 en t4 niet global worden (door ze te declareren met het var-keyword zodat ze local zijn binnen de functie) en/of gebruik andere variabele-namen.

oh:

code:

1	language="javascript 1.4"

is complete nonsense - gewoon weglaten en alleen het type-attribuut gebruiken.

[ Voor 17% gewijzigd door crisp op 27-12-2004 18:47 ]

Intentionally left blank

maandag 27 december 2004 18:53

Acties:

Verwijderd

Het is heel eenvoudig. IE heeft zelf al de globale variabele t1 gemaakt die verwijst naar dat object. Als je er een locale van maakt (var ervoor) krijg je geen error.

edit:
geen koffie halen tussendoor ;P

[ Voor 12% gewijzigd door Verwijderd op 27-12-2004 18:53 ]

maandag 27 december 2004 19:36

Acties:

Verwijderd

Topicstarter

Ok bedankt, het werkt! Hmm best wel jammer heb er 2 uur op zitten kijken, maar kon het niet vinden.

maandag 27 december 2004 19:44

Acties:

drm

f0pc0dert

wVm:
Ok bedankt, het werkt! Hmm best wel jammer heb er 2 uur op zitten kijken, maar kon het niet vinden.

Best begrijpelijk, dit is typisch zo'n "Daar hoef je maar 1 keer achter te komen"-foutje

Music is the pleasure the human mind experiences from counting without being aware that it is counting
~ Gottfried Leibniz