I want to put a mask on the phone number but it is not working, I've tried it anyway, with different ways to call the jQuery and jQuery.mask file. I'll show you how my code is, am I doing something wrong? (in another project I did exactly that way and it works ...)
<script type="text/javascript">
function checaForm()
{
var nome = $('#name').val();
var email = $('#email').val();
var celular = $('#phone').val();
if(nome == "")
{
alert("Por favor digite um nome.");
return false;
}
if(email == "")
{
alert("Por favor digite um email.");
return false;
}
var re = /[A-Z0-9._%+-]+@[A-Z0-9.-]+.[A-Z]{2,4}/igm;
if (!re.test(email))
{
alert('O e-mail digitado é inválido.');
return false;
}
if(celular == "")
{
alert("Por favor digite seu celular.");
return false;
}
if(celular.substr(5,1) == '3'){
alert("Número de celular inválido.");
return false;
}
if(celular.length <= 10){
alert("Digite seu número completo, com ddd.");
return false;
}
var behavior = function (val) {
return val.replace(/\D/g, '').length === 11 ? '(00) 00000-0000' : '(00) 0000-00009';
},
options = {
onKeyPress: function (val, e, field, options) {
field.mask(behavior.apply({}, arguments), options);
}
};
$('#phone').mask(behavior, options);
}
</script>
<script type="text/javascript" src="assets/js/jquery.min.js"></script>
<script type="text/javascript" src="assets/js/jquery.mask.js"></script>
<div class="modal-body">
<form id="formcall" class="contact100-form validate-form">
<div class="wrap-input100 validate-input">
<input id="name" class="input100" type="text" name="name" placeholder="Seu nome">
<span class="focus-input100"></span>
<label class="label-input100" for="name">
<span class="lnr lnr-user m-b-2"></span>
</label>
</div>
<div class="wrap-input100 validate-input">
<input id="email" class="input100" type="text" name="email" placeholder="Seu e-mail">
<span class="focus-input100"></span>
<label class="label-input100" for="email">
<span class="lnr lnr-envelope m-b-5"></span>
</label>
</div>
<div class="wrap-input100 validate-input">
<input id="phone" class="input100" type="text" name="phone" placeholder="Seu celular">
<span class="focus-input100"></span>
<label class="label-input100" for="phone">
<span class="lnr lnr-smartphone m-b-2"></span>
</label>
</div>
<div class="container-contact100-form-btn" style="text-align: center;">
<button id="envligacao" class="btn btn-primary btn-circle btn-translate--hover mt-4" onClick="return checaForm();">
Me ligue agora
</button>
</div>
</form>
</div>