Søg
Avatar billede weblance Nybegynder
18. december 2006 - 18:44 Der er 2 kommentarer og
1 løsning

Vise/skjule tekst når man trykker på link , hvordan?

Jeg har en side hvor der er en oversigt over hoteller, aktiviteter, begivenheder osv.

Og jeg kunne godt tænke mig at den fungerer sådan her:

På siden vises der kun fx. hotelnavne (links). Når brugeren trykker på et link (hotelnavnet) så vises oplysningerne lige nedenunder linket, trykker brugeren på linket igen, så forsvinder oplysningerne igen. Så skal der være sådan at man kan trykke på forskellige navne (links), og så se oplysningerne på de forskellige emner for på den måde at kunne sammenligne oplysningerne.

Jeg er overbevist om at det kan lade sig gøre i JavaScript, men hvordan gør man det?
Avatar billede jokkejensen Novice
18. december 2006 - 20:48 #1
hey..

Effekten opnås ofte ved at man gennem javascript tildeler et element en onclick event..

ex :

<h1 onclick="visInfo('HotelExp')">Hotel exp.dk</h1>

og nedenunder har et div med de oplysninger der skal være skjult :

<div id="HotelExp">Flere 1000 senge</div>

dette div skjuler man så normalt med display:none; gennem CSS så det ikke normalt kan ses.. Når brugeren klikker på overskriften, affyrer visInfo(), VisInfo funktionen læser så om divet allerede er foldet ud eller om det skal vises. du kan aflæse tilstanden med

function visInfo(elm)
{
Elm = document.getElementById(elm);
//udskrives block er det vist, udskrives hidden er det skjult
window.alert(Elm.style.display);
}
Avatar billede jokkejensen Novice
18. december 2006 - 21:01 #2
her er et praktisk eksempel - måske ikke det flotteste kode, men du har et udgangspunkt:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xml:lang="da">
<head>
<script type="text/javascript">
function visInfo(elm)
{
//opretter en instans af elementet
var Elm = document.getElementById(elm);

//Opretter en sandt/falsk værdi, der er fortæller om den er "åben" eller ej.
var IsOpen = Elm.style.display == 'none' ? false : true;

//hvis den er åben og der klikkes, skal det fjernes (display:none;)
    if(IsOpen)
    {
        Elm.style.display = 'none';
    }
    else //ellers skal det vises
    {
        Elm.style.display = 'block';
    }
}
</script>
</head>
<body>
<div id="Hotels">
    <div id="HotelExp">
        <h1 style="cursor: pointer" onclick="visInfo('Info_HotelExp')">Hotel Exp</h1>
        <div id="Info_HotelExp" style="display:none;">10000 senge</div>
    </div>
    <div id="HotelGoogle">
        <h1 style="cursor: pointer" onclick="visInfo('Info_HotelGoogle')">Hotel Google</h1>
        <div id="Info_HotelGoogle" style="display:none;">1000000 senge</div>
    </div>
</div>
</body>
</html>
Avatar billede jokkejensen Novice
18. december 2006 - 21:48 #3
sig til hvis jeg ikke har forklaret mig tilstrækkeligt...
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
Kategori
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript 5 27/04/202620:09 03/05/202613:59
Validering af filnavn i formular Af Strawberry i JavaScript 8 14/04/202610:11 20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript 2 03/02/202614:19 04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript 9 18/04/202516:52 22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript 2 14/02/202511:47 27/06/202514:34
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I dag 18:09 Outlook Classic, lukker ikke Af mort1 i E-mail programmer
I går 20:48 Bred buet skærm vs. 2 skærme Af Nanarsi i Skærme
I går 18:07 Tilslut printer til netværk med WPS - hvis WPS slukkes på Router mistes forbindelse. Af Uvanga i Wifi
11/0521:05 Questyle M15i lydforstærker Af valby i Diverse
11/0518:27 Mærkeligt ikon på proceslinjen Af ErikHg i Windows
White papers
Flere white papers »