2011-02-09 14 views
18

Estoy tratando de crear un área de texto que solo escriba mayúsculas, incluso si el usuario no está presionando shift o tiene mayúsculas bloqueadas. Idealmente, esto aceptaría la entrada sin importar nada y simplemente lo cambiaría automáticamente a mayúsculas. La mayoría de las formas en las que estoy pensando parecen un poco torpes y también muestran las minúsculas antes de que se conviertan.Hacer un área de texto todo en mayúsculas?

¿Alguna sugerencia o estrategia?

Respuesta

30

puede utilizar CSS

textarea { text-transform: uppercase; } 

Sin embargo, esto sólo se rinde en el navegador. digamos que si desea inyectar el texto en un script o db en el área de texto como mayúsculas, deberá usar javascript toUpperCase(); antes de la inyección o formulario de envío.

aquí es el jsfiddle por ejemplo:

html:

<textarea>I really like jAvaScript</textarea> 

css:

textarea{ 
text-transform: uppercase; 
} 

javascript:

var myTextArea = document.getElementsByTagName('textarea'); 

for(var i=0; i<myTextArea.length; i++){ 
    console.log('Textarea ' + i + ' output: ' + myTextArea[i].innerHTML); //I really like jAvaScript 
    console.log('Textarea ' + i + ' converted output: ' + myTextArea[i].innerHTML.toUpperCase()); //I REALLY LIKE JAVASCRIPT 
} 
+0

¿No es bueno usar strtoupper php (string $ cadena) en lugar de utilizar a largo Javascript – Arif

6

CSS:

textarea { text-transform: uppercase; } 
3

Quintin,

crear un estilo en su CSS como las siguientes:

área de texto { text-transform: mayúsculas; }

3

trate de añadir un

textarea{ 
    text-transform: uppercase; 
} 

al área de texto.

0

Añadir lo puede conseguir CSS:

textarea { text-transform: uppercase; } 
Cuestiones relacionadas