webForumDet fria alternativet

Lägga till en knapp...

3 svar · 547 visningar · startad av Tess_

Tess_Medlem sedan feb. 20102 inlägg
#1

Hej!
Skulle vilja ha hjälp med två saker.
1. Har gjort en dropdown lista där jag väljer vilken siffra jag vill se information om. Direkt när jag väljer kommer info upp men jag vill att infon kommer upp först när jag har tryckt på knappen. Just nu har jag kommit såhär långt:

<script language="javascript" type="text/javascript">
function visaInfo(v)
{
for (var i = 1; i <= 3; i++)
document.getElementById("minBox_"+i+"").style.visibility= 'hidden';
document.getElementById("minBox_"+v+"").style.visibility= 'visible';
}
</script>
</head>

<body>

<DIV name="minBox_1" id="minBox_1" style="position:absolute; visibility:hidden;top:50px;left:100px;">
Information om nr 1...</DIV>
<DIV name="minBox_2" id="minBox_2" style="position:absolute; visibility:hidden;top:50px;left:100px;">
Information om nr 2......</DIV>
<DIV name="minBox_3" id="minBox_3" style="position:absolute; visibility:hidden;top:50px;left:100px;">
Information om nr 3......</DIV>

<select name="info" size="1" onchange="visaInfo(this.value);">
<option value="0">Välj...</option>
<option value="1">Nr 1</option>
<option value="2">Nr 2</option>
<option value="3">Nr 3</option></select>
<input type="button" name="knapp" value="Visa information">
</body>

2. Är det svårt att göra om så att infon visas i bara ett div lager med hjälp av variabler?

Mvh
Tess

voigtann1Medlem sedan juni 20019 519 inlägg
#2

Är det: http://www.webforum.nu/showthread.php?t=178249 du är ute efter?

det är bara att flytta bort onchange="" till din knapp och sätt den som en onclick, sen måste du referea till din select box istället.

<script language="javascript" type="text/javascript">
function visaInfo(selectbox) {
	for(var i=0;i<selectbox.options.length;i++){	//Loop all the select box values to hide all the elements that wont show
		var optionValue = selectbox.options[i].value;
		var el = document.getElementById("minBox_" + optionValue);
		if(el) {
			el.style.visibility = (selectbox.value==optionValue?'visible':'hidden'); //If the Option value is Equal with the selected value, show the element, else hide it.
		}
	}
}
</script>

<DIV name="minBox_1" id="minBox_1" style="position:absolute; visibility:hidden;top:50px;left:100px;">
Information om nr 1...</DIV>
<DIV name="minBox_2" id="minBox_2" style="position:absolute; visibility:hidden;top:50px;left:100px;">
Information om nr 2......</DIV>
<DIV name="minBox_3" id="minBox_3" style="position:absolute; visibility:hidden;top:50px;left:100px;">
Information om nr 3......</DIV>
	
	
	
<select id="information" name="info" size="1">
	<option value="0">Välj...</option>
	<option value="1">Nr 1</option>
	<option value="2">Nr 2</option>
	<option value="3">Nr 3</option>
</select>

<input type="button" name="knapp" value="Visa information" onclick="visaInfo(document.getElementById('information'));">
	
</form>

Att få ändra texten i ett html element är ju inte svårt, det är bara att sätta med javascript och innerHTML: http://www.tizag.com/javascriptT/javascript-innerHTML.php

Tess_Medlem sedan feb. 20102 inlägg
#3

Fått svar på fråga 1, tack!
Ganska ny på det här så jag kanske förklarade dåligt på fråga2, skulle ha utvecklat det mer. Men det jag försöker säga är att när jag väljer nr1 trycker på knappen så med hjälp av en variabel skrivs informationen om nr 1 in i ett div lager.

var namn= något??

if (namn == "nr1")
{
namn=("Nummer 1");
typ=("siffra");
}

if (namn == "nr2")
{
namn=("Nummer 2");
typ=("siffra");
}

if (namn == "nr3")
{
namn=("Nummer 3");
typ=("siffra");
}

document.write("Information om " + namn + "," + typ +".");

voigtann1Medlem sedan juni 20019 519 inlägg
#4

jo, men istället för document.write så kör hämtar du upp elementet du vill skriva över dess innre HTML kod:

document.getElementById("Element").innerHTML = "en sträng variabel";
129 ms totalt · 3 externa anrop · v20260731065814-full.30151723
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
125 ms — hämta tråd, inlägg och bilagor (db)