settare "color" di paragrafo dal "value" di input ... text

[*pragma]

ciao a tutti
.... come dal titolo.

lo script è questo:

function cambiaCol() {
val = document.getElementById("insval").getAttribute("va lue")
document.getElementById("par").style.color="val"
}
function mostra() {
alert (document.getElementById("insval").getAttribute("v alue"))
}

nel body va questo:
<p id="par">questo è il paragrafo interesseto</p>


<form> <input id="insval" type="text" value="">



<input onClick="cambiaCol()" value="cambia Colore" type="button">



<input onClick="mostra()" value="mostra valore" type="button">

</form>

e non funge! per cortesia chi mi da una mano con risultato compatibile almeno con IE5+ , Mozilla e Opera.
Grazie

[secan]

Prova con:

document.getElementById('par').style.color = document.forms['nomeForm'].elements['insval'].value

Ma tieni presente che nulla mi vieterebbe di inserire nella textbox un valore non valido
Secan

[*pragma]

Originariamente inviato da secan
Prova con:
...........
Ma tieni presente che nulla mi vieterebbe di inserire nella textbox un valore non valido
Secan

ottimo funge!
si il discorso della correttezza del valore è poi un'altra cosa.

In pratica io facevo un'errore nell'impostare la variabile?

[*pragma]

ho capito.
document.getElementById("par").style.color="val"
non ci vogliono le virgolette per VAL
grazie

[secan]

Ehm... di preciso non ti so dire per quale motivo non funzionasse il tuo codice: io sono più uno "smanettone" che un vero e proprio web developper.
Per quanto riguarda la validità del colore inserito, potresti ovviare al problema usando un campo <select> ed impostando un gruppo di valori predefiniti:

<select id="insval" name="insval">
  <option value="red">rosso</option>
  <option value="yellow">giallo</option>
  <option value="green">verde</option>
  <option value="blue">blue</option>
</select>

e modificando il codice che ti ho postato prima in questo modo:

document.getElementById('par').style.color = document.forms['nomeForm'].elements['insval'].options[document.forms['nomeForm'].elements['insval'].selectedIndex].value

[*pragma]

Originariamente inviato da secan
Ehm... di preciso non ti so dire per quale motivo non funzionasse il tuo codice: io sono più uno "smanettone" che un vero e proprio web developper.
Per quanto riguarda la validità del colore inserito, potresti ovviare al problema usando un campo <select> ed impostando un gruppo di valori predefiniti:
..............................
.............

Ti ringrazio secan, ma il mio problema è solo capire come rendere il + compatibile possibile, con i browser, una funzioncina come quella esposta.
Ho esultato troppo presto perchè non funziona con Mozilla!
Poi i controlli su ciò che viene scritto nella text si possono attuare.
grazie

[Xinod]

mozilla con getAttribute non restituisce il valore aggiornato ma quello al caricamento,
puoi usare document.getElementById('id_input').value
ciao

[*pragma]

grazie Xinod