---
title: "gömma visa lager"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/70927-gömma-visa-lager"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "aleborg"
published: "2003-03-12T17:30:31.000Z"
updated: "2003-03-17T19:07:48.000Z"
replies: 7
views: 293
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/70927-gömma-visa-lager"
---

# gömma visa lager

## #1 — aleborg, 2003-03-12T17:30Z

Jag har en sida som ser ut ungefär så här:

```
<form>
<table width="100%" border="0" cellspacing="0" cellpadding="5">
  <tr> 
    <td><select name="select">
        <option>1</option>
        <option>2</option>
        <option>3</option>
      </select></td>
  </tr>
  <tr> 
    <td><textarea name="a_1" id="a_1"></textarea> 
      <textarea name="a_2" id="a_2"></textarea> 
      <textarea name="3" id="a_3"></textarea></td>
  </tr>
  <tr> 
    <td><div id="1">1</div><div id="2">2</div><div id="3">3</div></td>
  </tr>
  <tr> 
    <td><textarea name="b_1" id="b_1"></textarea> 
      <textarea name="b_2" id="b_2"></textarea> 
      <textarea name="b_3" id="b_3"></textarea></td>
  </tr>
</table>
</form>
```

Jag är på jakt efter ett script som döljer följande:
a_2, a_3, b_2, b_3, div 2 och 3
när man sen ändrar i select till 2 så ska 
a_2, b_2 samt div 2 visas och resten döljas
och ändrar man till 3 så ska 3:orna visas och resten döljas

någon som kan hjälpa mig?

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

## #2 — Peter S, 2003-03-12T20:15Z

Så här kanske:

```
<script type="text/javascript">
<!--

var nodes = null;

function showHide( n ){
	for( var i=0; i < nodes.length; i++ ){
		if( ( nodes[ i ].name && nodes[ i ].name.toString().indexOf( n ) != -1 ) || ( nodes[ i ].id && nodes[ i ].id.toString().indexOf( n ) != -1 ) )
			nodes[ i ].style.visibility = "visible";

		if( ( nodes[ i ].name && nodes[ i ].name.toString().indexOf( n ) == -1 && nodes[ i ].name.toString() != "select" ) || ( nodes[ i ].id && nodes[ i ].id.toString().indexOf( n ) == -1 ) && nodes[ i ].style.visibility == "visible" )
			nodes[ i ].style.visibility = "hidden";
	}
};

window.onload = function(){
	nodes = ( document.all ) ? document.forms[ "foo" ].all : document.forms[ "foo" ].getElementsByTagName( "*" );

	for( var i=0; i < nodes.length; i++ ){
		if( ( nodes[ i ].name && ( nodes[ i ].name.toString().indexOf( "1" ) == -1 && nodes[ i ].name.toString() != "select" ) ) || ( nodes[ i ].id && nodes[ i ].id.toString().indexOf( "1" ) == -1 ) )
			nodes[ i ].style.visibility = "hidden";

		else if( ( nodes[ i ].name && nodes[ i ].name != "select" ) || nodes[ i ].id )
			nodes[ i ].style.visibility = "visible";
	}
};

//-->
</script>

...

<form name="foo">
<table width="100%" border="0" cellspacing="0" cellpadding="5">
  <tr> 
    <td><select name="select" onchange="showHide(this.selectedIndex+1)">
        <option>1</option>
        <option>2</option>
        <option>3</option>
      </select></td>
  </tr>
  <tr> 
    <td><textarea name="a_1" id="a_1"></textarea> 
      <textarea name="a_2" id="a_2"></textarea> 
      <textarea name="3" id="a_3"></textarea></td>
  </tr>
  <tr> 
    <td><div id="1">1</div><div id="2">2</div><div id="3">3</div></td>
  </tr>
  <tr> 
    <td><textarea name="b_1" id="b_1"></textarea> 
      <textarea name="b_2" id="b_2"></textarea> 
      <textarea name="b_3" id="b_3"></textarea></td>
  </tr>
</table>
</form>
```

Notera att jag givit formuläret ett namn ("*foo*").

 :)

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

## #3 — aleborg, 2003-03-12T21:03Z

Exakt så vill jag ha det fast rutorna i varje "grupp" ska ligga på samma ställe, förmodar att man måste använda \<div\> då, hur gör man då?

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

## #4 — Peter S, 2003-03-12T21:48Z

Nej, det räcker med att byta ut alla:

\- "visibility" mot "display"
\- "visible" mot "block"
\- "hidden" mot "none"

Klipp ut och klistra in ;) 

```
<script type="text/javascript">
<!--

var nodes = null;

function showHide( n ){
	for( var i=0; i < nodes.length; i++ ){
		if( ( nodes[ i ].name && nodes[ i ].name.toString().indexOf( n ) != -1 ) || ( nodes[ i ].id && nodes[ i ].id.toString().indexOf( n ) != -1 ) )
			nodes[ i ].style.display = "block";
		if( ( nodes[ i ].name && nodes[ i ].name.toString().indexOf( n ) == -1 && nodes[ i ].name.toString() != "select" ) || ( nodes[ i ].id && nodes[ i ].id.toString().indexOf( n ) == -1 ) && nodes[ i ].style.display == "block" )
			nodes[ i ].style.display = "none";
	}
};

window.onload = function(){
	nodes = ( document.all ) ? document.forms[ "foo" ].all : document.forms[ "foo" ].getElementsByTagName( "*" );

	for( var i=0; i < nodes.length; i++ ){
		if( ( nodes[ i ].name && ( nodes[ i ].name.toString().indexOf( "1" ) == -1 && nodes[ i ].name.toString() != "select" ) ) || ( nodes[ i ].id && nodes[ i ].id.toString().indexOf( "1" ) == -1 ) )
			nodes[ i ].style.display = "none";
		else if( ( nodes[ i ].name && nodes[ i ].name != "select" ) || nodes[ i ].id )
			nodes[ i ].style.display = "block";
	}
};

//-->
</script>
```

 :)

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

## #5 — aleborg, 2003-03-17T17:46Z

Tack det funkar utmärkt men....
Exemplet ovanför var bara ett exempel :e
Mina fält heter:
Page_Text_SE
Page_Text_EN
Page_Text_FI

Page_Keywords_SE
Page_Keywords_EN
Page_Keywords_FI

\<div\>:
SE
EN
FI

Övriga fält ska inte beröras.
Har bifogat en fil...

Bilagor:

- [index.txt](https://www.webforum.nu/a/1179.txt)

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

## #6 — Peter S, 2003-03-17T18:36Z

Vad tror du om detta? ( Bifogar en fil )

 :)

Bilagor:

- [aleborg.txt](https://www.webforum.nu/a/1181.txt)

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

## #7 — aleborg, 2003-03-17T18:43Z

Ahh, du e ju kung på det här, tackar och bockar! :e
btw, vilka begränsningar i webbläsare har scriptet?

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

## #8 — Peter S, 2003-03-17T19:07Z

Det \*skall\* fungera i IE4 och uppåt, Netscape 6 och uppåt, Mozilla, samt Opera 7.

Jag har gjort en liten ändring, så du kan använda det nu bifogade exemplet istället.

 :)

Bilagor:

- [aleborg.txt](https://www.webforum.nu/a/1183.txt)

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

---

Tråden på webben: https://www.webforum.nu/amne/javascript/70927-gömma-visa-lager