cambio colore in input text ma............

**markgrav** · 15-03-2004, 12:15

Ciao a tutti ,buon lunedì a tutti!!!
Vi posto questo script che cambia lo sfondo in una input text all'onfocus, e il tutto funziona ,come vedete, con l'identificazione degli campi tramite id.
Come posso farla funzionare non identificando i capi dall'id ma dal nome effettivo che nel caso per es. è "x"

<html>
<head>
<script type="text/javascript">
function changeColor(color,iden)
{
document.getElementById(iden).style.background=col or
}
</script>
</head>

</head>

<body>

This example demonstrates how to change the background color of an input field.</p>

Mouse over the three colored table cells, and the input field will change background-color:</p>

<table width="100%"><tr>

</tr></table>

<form>
<input type="text" id="x" name="pippo" onfocus="changeColor('aqua',this.id)" onBlur="changeColor('white',this.id)" size="20">
<input type="text" id="y" name="pippo" onfocus="changeColor('aqua',this.id)" onBlur="changeColor('white',this.id)" size="20">
<input type="text" id="z" name="pippo" onfocus="changeColor('aqua',this.id)" onBlur="changeColor('white',this.id)" size="20">
</form>

</body>
</html>

**markgrav** · 15-03-2004, 12:44

up^

**Mich_** · 15-03-2004, 13:05

Un oggetto HTML (che fa parte di un form) puoi individuarlo tramite getElementById(ID) (solo in browser recenti) oppure tramite la sintassi universale
document.NOMEFORM.NOMECAMPO

Nel primo caso devi dare la stringa contenuta nell'attributo ID, nel secondo quella contenuta nel NAME.

ma nel tuo form ci sono dei name uguali per campi diversi, e questo e` un errore.

Normalmente si usano lo stesso identificatore per l'ID e per il NAME (questo non da` problemi ed e` consigliato), ma per il mio esempio usero` stringhe diverse, per maggiore chiarezza.

HTML:
<form name="nomeform">
<input type="text" id="x" name="xn" onfocus="changeColor('aqua',this.id); camcol('aqua',this);" onblur="changeColor('white',this.id); camcol('white',this)">
...
</form>

JS - prima opzione:
function changeColor(color1,iden){
document.getElementById(iden).style.backgroundColo r = color1;
}

JS - seconda opzione:
function camcol(color1, cc) {
cc.style.backgroundColor = color1;
}

JS - terza opzione:
function camcol(color1, cc) {
var nomcampo = cc.name;
document.nomeform.elements[nomecampo].style.backgroundColor = color1;
}

Ciao
Michele

**markgrav** · 15-03-2004, 13:37

grazie mich_ ma quale mi suggeriresti?

**Mich_** · 15-03-2004, 15:53

La prima (getDocumentById() ) funziona solo nei browser recenti (da IE6 e N6 in poi).

La seconda va bene in tutti i browser (a partire da NN3 e IE3), ed e` la piu` usata (passando come parametro l'OGGETTO su cui agisce la funzione).

La terza la ho scritta solo per completezza, e serve a dimostrare l'uso del nome se passato come stringa.

Per cui nel tuo caso io userei la seconda.

Ciao
Michele

**markgrav** · 15-03-2004, 16:06

scusami non mi è chiara una cosa

camcol('aqua',this);

**Mich_** · 15-03-2004, 16:11

Si, ho fatto un po' di confusione.

Le funzioni introdotte da me vanno a sostituire le tue, ma siccome i parametri da passare sono diversi, le ho aggiunte.

IL this passa l'oggetto a cui si riferisce (nel tuo caso il campo).

Ciao
Michele

**markgrav** · 15-03-2004, 16:31

mi da errore ti posto il codice se ci puoi dare un okkio al volo

codice:

<html>
<head>
<script type="text/javascript">
function camcol(color1, cc) 
{ 
cc.style.backgroundColor = color1; 
} 
</script>>
</head>

<body> 



This example demonstrates how to change the background color of an input field.</p>


Mouse over the three colored table cells, and the input field will change background-color:</p>

<table width="100%"><tr>

</tr></table>

<form>
<input type="text" id="x" name="xn" onfocus="changeColor('aqua',this.id); camcol('aqua',this);"onBlur="changeColor('white',this.Name); camcol('white',this)"size="20">

<input type="text" id="y" name="yn" onfocus="changeColor('aqua',this.id); camcol('aqua',this);"onBlur="changeColor('white',this.Name); camcol('white',this)"size="20">

<input type="text" id="z" name="zn" onfocus="changeColor('aqua',this.id); camcol('aqua',this);"onBlur="changeColor('white',this.Name); camcol('white',this)"size="20">
</form>

</body>
</html>

**markgrav** · 15-03-2004, 16:59

mich_ci 6 non mi funge????

**Mich_** · 15-03-2004, 17:39

2 problemi che vedo al volo:

1. devi togliere il riferimento (la chiamata) alla tua funzine (che non c'e` piu`);

2. devi mettere uno spazio tra un attributo e l'altro:
this);" onBlur=

Ciao
Michele

Discussione: cambio colore in input text ma............

Strumenti discussione

Ricerca discussione

Visualizza

cambio colore in input text ma............

Permessi di invio