problema keyup maiuscolo
-
19-09-2019 - |
Domanda
Mi piacerebbe avere un ingresso che avrebbe cambiato in lettere maiuscole su keyup. Così allego un semplice evento su keyup.
HTML
<input id="test"/>
Javascript (con jQuery)
$("#test").keyup(function(){
this.value = this.value.toUpperCase();
});
Ma ho scoperto che in Chrome e IE, quando si preme freccia a sinistra, il cursore si muove automaticamente alla fine. Ho notato che dovrebbe rilevare se l'ingresso è unica lettera. Dovrei usare gamma codice chiave o espressioni regolari per il rilevamento?
Esempio: http://jsbin.com/omope3
Soluzione
In alternativa, è possibile utilizzare il seguente (questo è probabilmente più veloce e più elegante):
<input style="text-transform: uppercase" type='text'></input>
Ma che invia il valore-typed indietro nei dati del modulo, in modo da utilizzare uno dei seguenti per memorizzare come tutto in maiuscolo nel database:
MySQL: UPPER(str)
PHP: strtoupper()
Altri suggerimenti
Un'altra soluzione, se si utilizza il text-transform: uppercase; proprietà CSS:
<input id='test' style='text-transform: uppercase;' type='text'></input>
E con jQuery aiuterà a scegliere il evento sfocatura :
$("#test").blur(function(){
this.value = this.value.toUpperCase();
});
Con questa soluzione, non c'è bisogno di alto i campi del database, è possibile utilizzare il cursore per il movimento e l'utente può inserire / riscrivere il testo nel campo di input.
Utilizzare questa:
<input onkeyup="MakeMeUpper(this)" type="text"/>
E nel tuo JS Codice Parte messo:
function MakeMeUpper(f, e){
var actualValue = f.value;
var upperValue = f.value.toUpperCase();
if( actValue != upperValue){
f.value = upperValue;
}
}
Questo codice non cambierà il testo, se l'utente ha immesso qualcosa che non è un testo (sinistra o freccia a destra).
Si, sembra che alcuni browser spostare il cursore alla fine quando il valore viene aggiornato. Si potrebbe fare questo:
$("#test").keyup(function(){
var upper = this.value.toUpperCase();
if (this.value != upper)
this.value = upper;
});
che cambierà solo il valore se ha bisogno di essere cambiato. Tuttavia, che lascia ancora con il problema che se si digita abd
, spostare a sinistra, c
colpire per ottenere abcd
, il cursore sarà ancora ottenere spostato alla fine.
Javascript (con jQuery)
$("#test").keyup(function(){
$(this).val($(this).val().toUpperCase());
});
var str = $(this).val();
if (evt.keyCode != 37 && evt.keyCode != 39)
{
str = str.toLowerCase().replace(/\b[a-z]/g, function(letter) {
return letter.toUpperCase();
});
$(this).val(str);
}
Probabilmente si desidera guardare keyCode nella funzione keyup.
var UP_ARROW = 38,
DOWN_ARROW = 40;
$('#test').keyup(function(evt){
if (evt.keyCode == UP_ARROW)
{
this.value = this.value.toUpperCase();
}
if (evt.keyCode == DOWN_ARROW)
{
this.value = this.value.toLowerCase();
}
});