keyup problema mayúsculo

Question

Me gustaría tener una entrada que iba a cambiar a mayúsculas en keyup. Así que hay que adjuntar un evento simple en keyup.

HTML

<input id="test"/>

Javascript (jQuery)

$("#test").keyup(function(){
  this.value = this.value.toUpperCase();
});

Pero descubrí que en Chrome e IE, cuando se presiona la flecha izquierda, el cursor se mueve automáticamente a la final. Me he dado cuenta que yo debería detectar si la entrada es única carta. ¿Debo usar gama código clave o expresión regular para la detección?

Ejemplo: http://jsbin.com/omope3

Answer 1

O puede utilizar el siguiente (esto es probablemente más rápido y más elegante):

<input style="text-transform: uppercase" type='text'></input>

Pero que envía el valor como se ha escrito, de vuelta en los datos del formulario, a fin de utilizar cualquiera de los siguientes para almacenarla como en mayúsculas en la base de datos:

MySQL: UPPER(str)

PHP: strtoupper()

Answer 2

Otra solución, si se utiliza el text-transform: mayúsculas; propiedad CSS:

<input id='test' style='text-transform: uppercase;' type='text'></input>

Y con jQuery por seleccionar los evento desenfoque

$("#test").blur(function(){
  this.value = this.value.toUpperCase();
});

Con esta solución, que no tiene que los campos de la base superior, puede utilizar el cursor para el movimiento y el usuario puede insertar / reescribir el texto en el campo de entrada.

Answer 3

Utilice esta:

<input onkeyup="MakeMeUpper(this)" type="text"/>

Y en su parte JS Código poner:

function MakeMeUpper(f, e){ 
  var actualValue = f.value;        
  var upperValue = f.value.toUpperCase();
  if( actValue != upperValue){
    f.value = upperValue;       
  }   
}

Este código no va a cambiar el texto si el usuario ha introducido algo que no es de texto (flecha izquierda o derecha).

Answer 4

Sí, parece que algunos navegadores mover el cursor hasta el final cuando el valor se actualiza. Usted puede hacer esto:

$("#test").keyup(function(){
  var upper = this.value.toUpperCase();
  if (this.value != upper) 
      this.value = upper;
});

que sólo va a cambiar el valor si necesita ser cambiado. Sin embargo, que todavía le deja con el problema de que si escribe abd, mover a la izquierda, c golpear para obtener abcd, el cursor seguirá recibiendo trasladado al final.

Answer 5

Javascript (jQuery)

$("#test").keyup(function(){
  $(this).val($(this).val().toUpperCase());
});

Answer 6

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);
}

Answer 7

Es posible que desee mirar a keyCode en su función 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();
    }
});