---
title: "display...visa endast en beskrivning i taget."
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/140173-display-visa-endast-en-beskrivning-i-taget"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "pelikanen"
published: "2006-01-02T11:05:25.000Z"
updated: "2006-01-07T14:11:51.000Z"
replies: 10
views: 590
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/140173-display-visa-endast-en-beskrivning-i-taget"
---

# display...visa endast en beskrivning i taget.

## #1 — pelikanen, 2006-01-02T11:05Z

Hej!

Jag har ett script där tanken är att man ska kunna trycka på en länk för att få en längre beskrivning av en bok. Det funkar just nu. Problemet är att jag endast vill att man ska kunna se en beskrivning i taget. Det är säkert något lätt, är inte så haj på javascript

tack på förhand. (y) 

Pelikanen.

\<html\>
\<head\>
\</head\>

\<body\>
 \<SCRIPT\> 
 function visaymer(id){
	var elementName='ymer'+id;
	var HeaderElement = null;
	HeaderElement = document.getElementsByName(elementName);
	if(HeaderElement\[0\].style.display == "none")
		HeaderElement\[0\].style.display = "";
	else
		HeaderElement\[0\].style.display="none"
}
\</SCRIPT\> 

\<A onclick='visaymer(1999)' href='javascript:%20void(0)'\>visa ymer1999\</a\>
\<A onclick='visaymer(2000)' href='javascript:%20void(0)'\>visa ymer2000\</a\>
\<A onclick='visaymer(2001)' href='javascript:%20void(0)'\>visa ymer2001\</a\>
\<DIV id="ymer1999" style="DISPLAY: none" name="ymer1999"\> 
    \<p\>Detta är Ymer 1999 beskrivning...\</p\>              
      
      \</DIV\>
\<DIV id="ymer2000" style="DISPLAY: none" name="ymer2000"\> 
    \<p\>Detta är Ymer 2000..beskrivning\</p\>              
       \</DIV\>
	   \<DIV id="ymer2001" style="DISPLAY: none" name="ymer2001"\> 
    \<p\>Detta är Ymer 2001..beskrivning\</p\>              
       \</DIV\>
\</body\>
\</html\>

Permalänk: https://www.webforum.nu/p/140173

## #2 — plup, 2006-01-02T11:37Z

```
function toggleDiv (divid) {
	// börja med att "släcka" alla display-div'ar
	for(i = 0; i < document.getElementsByTagName('div').length; i++) {
		document.getElementsByTagName('div')[i].style.display == "none";
	}

	// tänd sedan den tänkta
	var present = document.getElementById(divid);
	present.style.display = "block";

}
```

 

\<a onclick="toggleDiv(y1999)" href="javascript:void(0)"\>visa y1999\</a\>
\<div id="y1999" style="display: none" name="y1999"\>
\<p\>Detta är Ymer 1999 beskrivning...\</p\>
\</div\>

har inte testat denna så det kanske blir ngt script error, men du hajar nog principen iaf.

**/red** 
nackdelen med ovanstående blir ju att alla \<div\>'ar påverkas i loopen, men man kan ju slänga in en

```
if (substr(minns inte) == "ymer") {
document.getElementsByTagName('div')[i].style.display == "none";
}
```

Permalänk: https://www.webforum.nu/p/1737750

## #3 — pelikanen, 2006-01-03T11:35Z

det funkar inte..

Hej!

Jag fattar principen i stora drag. Men tyvärr är jag för dålig på javascript för att kunna lista ut vad som inte fungerar med skriptexemplet som jag fick.

mvh

Pelikanen.

Permalänk: https://www.webforum.nu/p/1738150

## #4 — Peter S, 2006-01-04T14:44Z

```
function visaymer(id){
  var divs = document.getElementsByTagName("div"),
      len  = divs.length;

  for (var i = 0; i < len; ++i){
    var elm = divs.item(i);

    if (/^ymer(\d+)$/.test(elm.id)){
      if (RegExp.$1 == id){
	elm.style.display = "block";
      } else {
	elm.style.display = "none";
      }
    }
  }
}
```

 :)

Permalänk: https://www.webforum.nu/p/1738614

## #5 — pelikanen, 2006-01-07T12:09Z

Tack så mycket Peter! Nu funkar det! Förresten är det någon som kan tipsa om en bra bok om javascript. Det jag kan är väldigt elementärt. Bra sidor med vettiga tutorials efterlyses också.

mvh

Pelikanen.

Permalänk: https://www.webforum.nu/p/1739749

## #6 — Peter S, 2006-01-07T12:52Z

[Här](http://www.webforum.nu/showthread.php?t=100675) kan du se vad jag rekommenderar i bokväg.

Använd gärna funktionen [*acceptera som slutgiltigt svar*](http://www.webforum.nu/showthread.php?p=1138514&accept=yes)  (y)

Permalänk: https://www.webforum.nu/p/1739764

## #7 — pelikanen, 2006-01-07T13:05Z

Visade sig att jag ropade hej lite för tidigt. Till varje beskrivning finns även 1 bild mellan varje \<div\> tag
. Bilden visas inte med nuvarande skript. Väldigt skumt. Texten funkar som den ska men det kommer alltså inte upp någon bild. 

nån som kan hjälp. Man blir smått vansinning...

Pelikanen.

Permalänk: https://www.webforum.nu/p/1743127

## #8 — Peter S, 2006-01-07T13:21Z

Var ligger bilden menar du? Ligger den enligt nedan skall det inte vara några problem.

```
<DIV id="ymer1999" style="DISPLAY: none" name="ymer1999">
  <p>Detta är Ymer 1999 beskrivning...</p>
  [b]<img...>[/b]
</DIV>
```

Permalänk: https://www.webforum.nu/p/1743134

## #9 — pelikanen, 2006-01-07T13:33Z

Ja, det är så jag menar. Fattar inte själv varför det inte funkar. Här är hela koden.

\<html\>
\<head\>
\</head\>

\<body\>
\<SCRIPT\> 
function visaymer(id){
  var divs = document.getElementsByTagName("div");
      len  = divs.length;

  for (var i = 0; i \< len; ++i){
    var elm = divs.item(i);

    if (/^ymer(\\d+)$/.test(elm.id)){
      if (RegExp.$1 == id){
	elm.style.display = "block";
      } else {
	elm.style.display = "none";
      }
    }
  }
}

\</SCRIPT\> 

\<A onclick='visaymer(1999)' href='javascript:%20void(0)'\>visa ymer1999\</a\>
\<A onclick='visaymer(2000)' href='javascript:%20void(0)'\>visa ymer2000\</a\>
\<A onclick='visaymer(2001)' href='javascript:%20void(0)'\>visa ymer2001\</a\>
\<DIV id="ymer1999" style="DISPLAY: none" name="ymer1999"\> 
\<p\>Detta är Ymer 1999 beskrivning...\</p\> 
\<img src="ymer1999.jpg" width="200" height="285"\>
\</DIV\>
\<DIV id="ymer2000" style="DISPLAY: none" name="ymer2000"\> 
\<p\>Detta är Ymer 2000..beskrivning\</p\> 
\<img src="ymer2000.jpg" width="200" height="285"\>
\</DIV\>
\<DIV id="ymer2001" style="DISPLAY: none" name="ymer2001"\> 
  \<p\>\<img src="ymer2001.jpg" width="200" height="285"\>Detta 
    är Ymer 2001..beskrivning\</p\> 

\</DIV\>
\</body\>
\</html\>

Det som händer är att texten åker ner lite där bilden borde visas men man ser ingen bild.

mvh

Pelikanen.

Permalänk: https://www.webforum.nu/p/1743143

## #10 — Peter S, 2006-01-07T14:00Z

Jag har nu testat koden i IE 6, FF 1.5 och Opera 8.51; alla med samma goda resultat.

Se exempel på
<http://member.webforum.nu/4685/pelikanen.html>

Permalänk: https://www.webforum.nu/p/1743158

## #11 — pelikanen, 2006-01-07T14:11Z

Det funkar i Mozilla. I explorer funkar det fortfarande inte. Funderar på om det kan bero på virus. Datorna har betett sig underligt. Det är nog den troligaste anledningen. Kollade versionen. Jag har också IE version 6. Får jag virus nu.

Tack för hjälpen.

Permalänk: https://www.webforum.nu/p/1743163

---

Tråden på webben: https://www.webforum.nu/amne/javascript/140173-display-visa-endast-en-beskrivning-i-taget