Javascript: Show / hide

Door Doreen op 09-10-2006 10:53

792 views

Hoi allemaal,

Ik ben bezig met een javascriptje die vanuit een selectbox een extra invulveld weergeeft.

Werkt opzich prima, in Firefox echter alleen, hoet moet eigenlijk ook in IE7 werken. Weet iemand wat ik moet aanpassen om het werkend te krijgen ik heb het volgende:

De code in de head:


<script language="javascript">
	
function showField( id )
{						
document.all.insertedEmail.style.visibility = 'hidden'; 
document.all.insertedEmail.value = ''; 
document.all[ id ].style.visibility = 'visible'; 
document.all[ id ].focus();						
}
	
function hideField( id )
{
document.all.insertedEmail.style.visibility = 'visible'; document.all.insertedEmail.value = ''; 
document.all[ id ].style.visibility = 'hidden'; 
}
</script>

En dit in de body:


<select name="sendOption">
<option value="" selected="selected" onclick="hideField('insertedEmail' )">Kies een type..</option>
<option value="email" onClick="showField( 'insertedEmail' );">Versturen naar mijn e-mail</option>
<option value="opscherm" onclick="hideField('insertedEmail' )">Weergave op het scherm</option>
</select>

Hoop dat iemand me kan helpen.
Doreen

- wes -

09-10-2006 10:57

geef je name="" en id="" aan in je element, dan moet het al werken

Doreen

09-10-2006 10:59

Waar moet ik dat dan precies doen?

- wes -

09-10-2006 11:04

nou je hebt nu overal

<input type="text" name="bla" > etc etc

zet daar ook id="bla" bij in.

Doreen

09-10-2006 13:21

Ik heb het geprobeerd maar het werkt niet.


<script language="javascript">
	
function showField( id )
{
document.all[ id ].style.visibility = 'hidden'; 
document.all[ id ].value = ''; 
document.all[ id ].style.visibility = 'visible'; 
document.all[ id ].focus();			
}

function hideField( id )
{
document.all[ id ].style.visibility = 'visible'; 
document.all[ id ].value = ''; 
document.all[ id ].style.visibility = 'hidden'; 
}
</script>

En dit:


<form>
<select id="sendOption" name="sendOption">
<option id="sendOption" value="" selected="selected" onChange="hideField('insertedEmail' );">Kies een type..</option>
<option id="sendOption" value="email" onChange="showField( 'insertedEmail' );">Versturen naar mijn e-mail</option>
<option id="sendOption" value="opscherm" onChange="hideField('insertedEmail' );">Weergave op het scherm</option>
</select>
<input id="insertedEmail" type="text" name="insertedEmail" style="visibility:hidden" />
</form>

K i p

09-10-2006 14:37

Doe het gewoon zo:

		<form>
			<select id="sendOption" name="sendOption">
				<optgroup label="Kies een type...">
					<option id="sendOption" value="email" onChange="showField( 'insertedEmail' );">Versturen naar mijn e-mail</option>
					<option id="sendOption" value="opscherm" onChange="hideField('insertedEmail' );">Weergave op het scherm</option>
				</optgroup>
			</select>
			<input id="insertedEmail" type="text" name="insertedEmail" style="display: none;" />
		</form>

Doreen

09-10-2006 14:39

Wat is precies het verschil? Want mijn javascript werkt daardoor niet.

Reageren

Inloggen om te reageren