Selektering av vad som visas med en Select

Hejsan

Försöker att med en <select> bestämma vad som skall visas på en sida. Dvs med selecten skall tre olika innehåll visas. Idag använder jag <select> men att kunna göra den med en klick på en av tre giffar eller tre texter vore ännu bättre men jag har inte hittat något som passar.

Tyvärr så får jag det inte att fungera så undrar om det finns någon som sitter på någon bra länk till javascript skola? Alternativt on någon extrem bussig synar min felaktiga kod.

<script language="JavaScript">
function updateFields(selectObj) {
var VISIBLE = "visible";
var HIDDEN = "hidden";
var index= selectObj.selectedIndex;
var pick = selectObj.options[index].value;
var vAttend1 = VISIBLE;
var vAttend2 = HIDDEN;
var vAttend3 = HIDDEN;

if (pick == "setting") {

var vAttend1 = VISIBLE;
var vAttend2 = HIDDEN;
var vAttend3 = HIDDEN;

}
else if (pick == "tag") {

var vAttend1 = HIDDEN;
var vAttend2 = VISIBLE;
var vAttend3 = HIDDEN;

}
else if (pick == "relation") {
var vAttend1 = HIDDEN;
var vAttend2 = HIDDEN;
var vAttend3 = VISIBLE;
}
</script>

<div>
<select id="pick" onchange="updateFields(this);" >
<option value="setting">Settings</option>
<option value="tag">Tags</option>
<option value="relation">Relations</option>
</select>
</div>

<fieldset><legend>Entry Details:</legend>
<div style="visibility:hidden;" id="vAttend1">
apa1
</div>

<div style="visibility:hidden;" id="vAttend2">
apa2
</div>

<div style="visibility:hidden;" id="vAttend3">
apa3
</div>
</fieldset>

Observera att jag inte har någon koll på detta och detta kommer från ett omskrivet kodexemple som slutade fungera när jag började mecka.

<script language="JavaScript">
function updateFields(pick) {
	var VISIBLE = "visible";
	var HIDDEN = "hidden";
	var vAttend1 = VISIBLE;
	var vAttend2 = HIDDEN;
	var vAttend3 = HIDDEN;

	if (pick == "setting") {
		var vAttend1 = VISIBLE;
		var vAttend2 = HIDDEN;
		var vAttend3 = HIDDEN;
	}
	else if (pick == "tag") {
		var vAttend1 = HIDDEN;
		var vAttend2 = VISIBLE;
		var vAttend3 = HIDDEN;
	}
	else if (pick == "relation") {
		var vAttend1 = HIDDEN;
		var vAttend2 = HIDDEN;
		var vAttend3 = VISIBLE;
	}
	document.getElementById('vAttend1').style.visibility = vAttend1;
	document.getElementById('vAttend2').style.visibility = vAttend2;
	document.getElementById('vAttend3').style.visibility = vAttend3;
}
</script>

Skicka antingen värdet direkt från select-elementet:

<select id="pick" onchange="updateFields(this.options[this.selectedIndex].value);" >

eller exekvera scriptet genom klick på en gif-bild:

<img src="bla.gif" onclick="updateFields('relation');">

Eller en textlänk:

<a href="#" onclick="updateFields('relation'); return false;">länktext</a>

Mvh