Iakopa: Máscara em formulário usando jQuery

Olá Grupo,

Neste post vou mostrar como colocar máscara em campos de formulário, usando jQuery.

Vamos utilizar o jQuery na página e o arquivo maskedinput

Abaixo vejamos como usar no seu formulário:

</head>
<body>
<form method="post"> Telefone: <input type="text" name="telefone"

id="telefone" />  
 <br>  
 CEP: <input type="text" name="cep" id="cep" />  
 <br>  
 <br>  
 Data: <input type="text" name="data" id="data" />  
 <br>  
 <br>  
 CPF: <input type="text" name="cpf" id="cpf" />  
 <br>  
 <br>  
 CNPJ: <input type="text" name="cnpj" id="cnpj" />  
 </form>  
 </body>  
 </html>

<head>  
 <meta http-equiv="Content-Type" content="text/html;

charset=utf-8">  
 <title>Máscara em jQuery</title>  
 <script type="text/javascript" src="jquery-1.3.2.js">

</script>  
 <script type="text/javascript"

src="maskedinput-1.1.2.pack.js">

</script>  
 
 <script type="text/javascript">  
 $(document).ready(function(){  
 $(function(){  
 $.mask.addPlaceholder("~","[+-]");  
 $("#telefone").mask("(99) 9999-9999");  
 $("#cep").mask("99999-999");  
 $("#data").mask("99/99/9999");  
 $("#cpf").mask("999.999.999-99");  
 $("#cnpj").mask("99.999.999/9999-99");  
 });  
 });  
 </script>  
 
 </head>  
 <body>  
 <form method="post">  
 Telefone: <input type="text" name="telefone"

id="telefone" />  
 <br>  
 CEP: <input type="text" name="cep" id="cep" />  
 <br>  
 <br>  
 Data: <input type="text" name="data" id="data" />  
 <br>  
 <br>  
 CPF: <input type="text" name="cpf" id="cpf" />  
 <br>  
 <br>  
 CNPJ: <input type="text" name="cnpj" id="cnpj" />  
 </form>  
 </body>  
 </html>

2 de agosto de 2011

Máscara em formulário usando jQuery

Nenhum comentário:

Postar um comentário