There were some coding errors, which was to get the value of the field and give a focus
, that is, it does not represent the text box but the value contained in it, but it was how that was wrong, so I made a minimal example so you can check if it is what you need:
$('#doc').blur(function() {
if ($(this).val().length > 11) {
alert('cpf invalido');
$(this).val('');
$(this).focus();
}
});
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-3.3.1.js"></script><formclass="form-horizontal">
<fieldset>
<!-- Form Name -->
<legend>Form Name</legend>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="doc">Cpf | Cnpj:</label>
<div class="col-md-4">
<input id="doc" name="doc" type="text" placeholder="Isnira o cpf ou cnpj" class="form-control input-md">
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="nome">Nome:</label>
<div class="col-md-4">
<input id="nome" name="nome" type="text" placeholder="Nome completo" class="form-control input-md">
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="textinput">Telefone:</label>
<div class="col-md-4">
<input id="textinput" name="textinput" type="text" placeholder="Telefone" class="form-control input-md">
</div>
</div>
</fieldset>
</form>
A checked solution for CPF
and CNPJ
:
$('#doc').blur(function() {
if ($(this).val().length == 0) return;
var sts = false;
if ($(this).val().length == 11) {
sts = validate_cpf($(this).val());
} else {
if ($(this).val().length == 14) {
sts = validate_cnpj($(this).val());
}
}
if (!sts) {
$(this).val('');
alert('Cpf/Cnpj invalido');
$(this).focus();
}
});
function validate_cnpj(cnpj) {
cnpj = cnpj.replace(/[^\d]+/g, '');
if (cnpj == '') return false;
// Elimina CNPJs invalidos conhecidos
if (cnpj.length != 14 || cnpj == "00000000000000" ||
cnpj == "11111111111111" || cnpj == "22222222222222" ||
cnpj == "33333333333333" || cnpj == "44444444444444" ||
cnpj == "55555555555555" || cnpj == "66666666666666" ||
cnpj == "77777777777777" || cnpj == "88888888888888" ||
cnpj == "99999999999999")
return false;
// Valida DVs
length = cnpj.length - 2
numbers = cnpj.substring(0, length);
digit = cnpj.substring(length);
sum = 0;
pos = length - 7;
for (i = length; i >= 1; i--) {
sum += numbers.charAt(length - i) * pos--;
if (pos < 2)
pos = 9;
}
result = sum % 11 < 2 ? 0 : 11 - sum % 11;
if (result != digit.charAt(0))
return false;
length = length + 1;
numbers = cnpj.substring(0, length);
sum = 0;
pos = length - 7;
for (i = length; i >= 1; i--) {
sum += numbers.charAt(length - i) * pos--;
if (pos < 2)
pos = 9;
}
result = sum % 11 < 2 ? 0 : 11 - sum % 11;
if (result != digit.charAt(1))
return false;
return true;
}
function validate_cpf(strCPF) {
var Soma;
var Resto;
Soma = 0;
if (strCPF == "00000000000") return false;
for (i = 1; i <= 9; i++) Soma = Soma + parseInt(strCPF.substring(i - 1, i)) * (11 - i);
Resto = (Soma * 10) % 11;
if ((Resto == 10) || (Resto == 11)) Resto = 0;
if (Resto != parseInt(strCPF.substring(9, 10))) return false;
Soma = 0;
for (i = 1; i <= 10; i++) Soma = Soma + parseInt(strCPF.substring(i - 1, i)) * (12 - i);
Resto = (Soma * 10) % 11;
if ((Resto == 10) || (Resto == 11)) Resto = 0;
if (Resto != parseInt(strCPF.substring(10, 11))) return false;
return true;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-3.3.1.js"></script><formclass="form-horizontal">
<fieldset>
<!-- Form Name -->
<legend>Form Name</legend>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="doc">Cpf | Cnpj:</label>
<div class="col-md-4">
<input id="doc" name="doc" type="text" placeholder="Isnira o cpf ou cnpj" class="form-control input-md">
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="nome">Nome:</label>
<div class="col-md-4">
<input id="nome" name="nome" type="text" placeholder="Nome completo" class="form-control input-md">
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="textinput">Telefone:</label>
<div class="col-md-4">
<input id="textinput" name="textinput" type="text" placeholder="Telefone" class="form-control input-md">
</div>
</div>
</fieldset>
</form>