Tadde
10-02-2010, 00:40
Mi sono trovato di fronte a un problema inaspettato.
Questo semplice pezzo di codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
function checkLen(x) {
if (x.value.length === x.maxLength)
x.nextSibling.focus();
}
</script>
</head>
<body>
<p>Salta al campo successivo quando raggiungo la maxlength di quello attuale:</p>
<form id="myForm">
<input size="3" maxlength="3" onkeyup="checkLen(this)" />
<input size="2" maxlength="2" onkeyup="checkLen(this)" />
<input size="3" maxlength="3" onkeyup="checkLen(this)" />
</form>
</body>
</html>
non funziona come dovrebbe se viene copiato e incollato così com'è e aperto con un browser.
Il problema sta nel fatto che dopo ogni tag <input> io sono andato a capo col tasto invio, e questo carattere speciale viene considerato dal browser come uno spazio.
Quindi quando nel codice Javascript indirizzo il nextSibling dell'elemento che chiama la funzione, questo elemento indirizzato non è il seguente tag <input> come vorrei ma lo spazio tra i due.
Se provate a togliere i ritorni a capo tra i tag invece funzionerà come voluto.
Ho provato a salvare il documento con i ritorni a capo in vari formati (ANSI, UTF-8, ecc...), ma non cambia nulla.
Io alla leggibilità di un codice coi ritorni a capo al punto giusto non vorrei rinunciare, invece vorrei rinunciare alle trappole come quella in cui mi sono imbattuto stasera :) .
Conoscete qualche fix o stratagemma per risolvere il problema, cioè per poter scrivere codice senza doversi preoccupare di questo comportamento dei browser (pare sia un comportamento comune a tutti o quasi i browser)?
Questo semplice pezzo di codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
function checkLen(x) {
if (x.value.length === x.maxLength)
x.nextSibling.focus();
}
</script>
</head>
<body>
<p>Salta al campo successivo quando raggiungo la maxlength di quello attuale:</p>
<form id="myForm">
<input size="3" maxlength="3" onkeyup="checkLen(this)" />
<input size="2" maxlength="2" onkeyup="checkLen(this)" />
<input size="3" maxlength="3" onkeyup="checkLen(this)" />
</form>
</body>
</html>
non funziona come dovrebbe se viene copiato e incollato così com'è e aperto con un browser.
Il problema sta nel fatto che dopo ogni tag <input> io sono andato a capo col tasto invio, e questo carattere speciale viene considerato dal browser come uno spazio.
Quindi quando nel codice Javascript indirizzo il nextSibling dell'elemento che chiama la funzione, questo elemento indirizzato non è il seguente tag <input> come vorrei ma lo spazio tra i due.
Se provate a togliere i ritorni a capo tra i tag invece funzionerà come voluto.
Ho provato a salvare il documento con i ritorni a capo in vari formati (ANSI, UTF-8, ecc...), ma non cambia nulla.
Io alla leggibilità di un codice coi ritorni a capo al punto giusto non vorrei rinunciare, invece vorrei rinunciare alle trappole come quella in cui mi sono imbattuto stasera :) .
Conoscete qualche fix o stratagemma per risolvere il problema, cioè per poter scrivere codice senza doversi preoccupare di questo comportamento dei browser (pare sia un comportamento comune a tutti o quasi i browser)?