Remover máscara com JQuery ...
Boa tarde pessoal ...
Sou novato em JavaScript e mais ainda em JQuery. Estou desenvolvento um site para o negócio da minha tia e estou apanhando mais que "cachorrinho de bem" como diria minha vó.
Estou tentando colocar uma máscara no campo telefone. Colocar eu consegui, o que eu não consigo é removê-la.
Minha ideia para o campo é a seguinte:
Quando o usuário acessa o site e vê o formulário, dentro do <input> telefone tem a frase: "Telefone fixo ...". Assim que o usuário clica no campo para reenchê-lo, a frase "some" e entra a máscara. Beleza, fiquei feliz por conseguir isso ...
Porém, quando o usuário só clica no campo e logo sai sem preenchê-lo, eu não consigo fazer a frase: "Telefone fixo ..." voltar, como acontece em todos os outros campos que não possuem máscara.
Eu fiz um teste para que, quando o usuário clicasse no campo e saísse dele sem preencher, automaticamente fossem inseridos números e Voilà, os números apareceram formatados.
Dessa forma, acredito que se eu retirar a máscara quando o usuário clicar no campo, mas não preenchê-lo, eu consiga inserir novamente a frase: "Telefone fixo ...".
Vou colocar abaixo alguns trechos de código ...
Código (X)HTML ...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<?php date_default_timezone_set("America/Sao_Paulo"); ?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>TOTALIT</title>
<link rel="stylesheet" media="screen" type="text/css" href="style.css" />
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="jquery.maskedinput.min.js"></script>
<script type="text/javascript" src="events.js"></script>Código JavaScript ...
$(document).ready(function() {
$("#webmail").attr("target","_blank");
$("input").focus(function(){
$(this).css({"background-color":"#FFFFB2","color":"#000000"});
conteudo = $(this).val();
$(this).val("");
if (conteudo == "Telefone fixo ...") {
$("[name='telefone']").mask("(99) 9999-9999");
}
});
$("input").blur(function(){
$(this).css({"background-color":"#FFFFFF", "color":"#0000FF"});
if ($(this).val() == "") {
if (conteudo == "Telefone fixo ...") {
$("[name='telefone']").unmask();
}
$(this).css("color","#999999");
$(this).val(conteudo);
}
});Espero que alguém possa me ajudar ... muito obrigado!
Discussão (5)
Carregando comentários...