Artigos W3TI

...W3TI...

Como converter minúsculas em maiúsculas em Javascript no campo Input text

Escrito por Evandro Panaro Cavichioli no dia 30/09/2010

Categoria: JavaScript

Ola pessoal!

Neste tópico irei explicar como fazer para converter dinamicamente um texto de um campo INPUT TEXT de MINÚSCULA para MAIÚSCULA ou vice-verso. Este caso é freqüentemente necessário para nós programadores que precisamos deixar nossos formulários com um visual mais profissional.

Segue modelo de exemplo:

<!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 up(lstr){ // converte minusculas em maiusculas
var str=lstr.value; //obtem o valor
lstr.value=str.toUpperCase(); //converte as strings e retorna ao campo
}
function down(lstr){ // converte maiusculas em minusculas
var str=lstr.value; //obtem o valor
lstr.value=str.toLowerCase(); //converte as strings e retorna ao campo
}
</script>
</head>
<body>
<form name="form" method="POST"  enctype="multipart/form-data">
<table width="100%" cellpadding="2" cellspacing="2" bgcolor="#F0F0F0">
<tr>
<th style="width: 50%">
Converter Minúscula para Maiúscula
</th>
<th style="width: 50%">
Converter Maiúscula para Minúscula
</th>
</tr>
<tr>
<td>
<input type="text" name="stringup" style="width: 90%" onkeyup="up(this)">
</td>
<td>
<input type="text" name="stringdown" style="width: 90%" onkeyup="down(this)">
</td>
</tr>
</table>
</form>
</body>
</html>

Copie, cole e salve como qualquerNome.html

Na programação acima temos campos do tipo text que quando digitado algo dentro (onKeyup) chama a função (function) up(esta converte de minúscula para maiúscula) e a down(esta converte de maiúscula para minúscula) que retorna a conversão para o mesmo campo.

Bom Pessoal, espero ter ajudado e que este exemplo facilite o dia-a-dia da programação de websites. Qualquer duvidas ou sugestões poste comentário ou Acesse www.w3ti.com.br Abraços a todos, até a proxima postagem.

Comentários 26

Escola de Poker disse:
Postado dia 16/07/2011 10:03:11
Oi:), chamo-me Teresa estudo Psicologia e adorei muito do teu blogue! Muito linda muito bem! Concordo muito bem tudo aquilo que aqui observei.Existe por vezes imenso que escrever nos blogues!Nada nada mais desafiante do que implementar a nossa marca na net! Beijinhos :)

Regras de Poker Texas Hold´em disse:
Postado dia 25/05/2011 12:01:02
Hello foi a 2ª vez que vi o teu espaço online e adorei imenso!Bom Trabalho! Adeus

appliance repair Orange County disse:
Postado dia 01/05/2011 10:55:06
Obrigado, bom trabalho! Este foi o material que eu tinha que ter.

forex automoney reviews disse:
Postado dia 21/04/2011 06:09:12
Este es un maravilloso recurso útil que usted está proporcionando y que le dan gratis ausente en el precio. Me encanta ver los sitios web, que comprenden el valor de proporcionar un recurso de calidad útiles de forma gratuita. Es la vieja lo que va, vuelve el programa.

João Carlos disse:
Postado dia 19/04/2011 09:19:10
Testei o código com sucesso no IE, mas no Firefox e no Chrome não funciona! Há algo a fazer nesse caso?

Poker Gratis disse:
Postado dia 17/02/2011 21:46:26
Escrita interessante neste blogue, visões assim dignificam a quem quer que visitar neste sítio !!! Entrega mais deste sítio, aos teus leitores.

Evandro Panaro Cavichioli disse:
Postado dia 18/02/2011 08:11:24
Agradeço o comentário, fico contente que seja satisfatório esses informações oferecidas.

Live Sex disse:
Postado dia 21/01/2011 19:59:11
I've grown so much for you and so much because of you.

Sex Cams disse:
Postado dia 11/01/2011 17:32:31
I am delighted that there are always new and interesting topics on this site. And this is the reason for that I read it.

Evandro P. Cavichioli disse:
Postado dia 12/01/2011 07:49:48
Thanks comment soon be a new version of our blog with a lot more richness of information

Dinheiro Grátis Poker Online disse:
Postado dia 23/12/2010 22:06:57
oi, tens uma página muito boa, gostei de o ler, e novamente aqui estou pois como estamos na altura do natal Feliz Natal, e que para 2011 faças muitas postagens para todos os blogues, sendo estes os votos de felicidade dos webmasters! Bom Natal e um ótimo ano novo

admin disse:
Postado dia 27/12/2010 08:11:56
Caro Amigo, desejo a você um ótimo Natal e um prospero Ano Novo repleto de virtudes e alegrias, que este ano que vem seje e vai ser de muito crescimento pessoal e profissional.

online marketing company disse:
Postado dia 20/12/2010 09:39:53
Há, obviamente, muito para saber sobre isso. Eu acho que você fez alguns bons pontos de recursos também. Continue trabalhando trabalho, ótimo!

watch shows online disse:
Postado dia 19/12/2010 18:16:19
Oi lá, eu encontrei seu blog através do Google, enquanto busca para os primeiros socorros de um ataque cardíaco e seu post parece muito interessante para mim.

Dinheiro Grátis Poker Online disse:
Postado dia 16/12/2010 22:39:13
Como estás?, observei o teu espaço online e apreciei imenso, tás a escrever muito bem! Vai em frente com o bom tema! Fiquem bem

Bónus de Poker Sem Depósito disse:
Postado dia 13/12/2010 20:41:33
Está tudo, li um pouco o teu blog e amei tanto, tás a trabalhar muito bem! Continua com o bom espaço! Fiquem bem

admin disse:
Postado dia 14/12/2010 07:48:39
Agradeço o comentário, em breve continuarei a postar mais.

maria andros disse:
Postado dia 08/12/2010 08:24:18
Thanks for the post, keep posting stuff

admin disse:
Postado dia 08/12/2010 11:57:15
Soon I'll post more

free government grant disse:
Postado dia 05/12/2010 05:58:01
Keep posting stuff like this i really like it

admin disse:
Postado dia 05/12/2010 23:08:36
thanks, we intend to remain so.

Swerneenvet disse:
Postado dia 02/12/2010 23:31:39
Tudo bem amigos é com extremo gosto que visito este belo blogue!adorei excessivamente o teu blogue! tas a fazer um muito bom conhecimento, hoje por vezes tanto para regidir nos blogues! Eu mesmo tenho uma pagina web de poker texas holdem sem deposito, comparece la, e expressa como eu fiz aqui a tua impressao em http://www.fulltiltbonus50gratis.pokersemdeposito.com/ ! vejo que no teu blogue so falta uma tool de traducao. De resto está muito bonito! cumps

admin disse:
Postado dia 05/12/2010 23:06:54
Agradeço o elogio, estamos com bastante serviços por esses dias mas em breve pretendemos postar mais artigos interessantes.

aparadekto disse:
Postado dia 26/10/2010 19:35:00
Hey, I can't view your site properly within Opera, I actually hope you look into fixing this.

admin disse:
Postado dia 27/10/2010 22:25:49
Thank aparadekto will be checking what is happening.

Fernando disse:
Postado dia 04/10/2010 18:51:05
Ótimo post.