Uncaught Typeerror: birthday.split is not a Function

Question

I have this javascript function that calculates age:

<script type = "text/javascript" >
  function calcularIdade(aniversario) {
    var nascimento = aniversario.split("/");
    var dataNascimento = new Date(parseInt(nascimento[2], 10),
      parseInt(nascimento[1], 10) - 1,
      parseInt(nascimento[0], 10));

    var diferenca = Date.now() - dataNascimento.getTime();
    var idade = new Date(diferenca);

    return Math.abs(idade.getUTCFullYear() - 1970);
  }
</script>

This is the line where I perform the calculation, remembering that the mask of this field is "11/29/2017"

<input type="text" id="nascimento" onkeypress="mascara(this,mdata)" maxlength="10" name="nascimento" onblur="calcularIdade(this)" runat="server" class="form-control" />

When I am typing the date, it is not informing the age, I went to check and is returning me the following error:

Uncaught Typeerror: birthday.split is not a Function at calculativeness (People.aspx?id=2:444) At Htmlinputelement.onblur

Return me error on this line:

var nascimento = aniversario.split("/");

I have tried several ways, checked the value, is coming out in the format dd/mm/yyyy

Updating: Function I use to put mask in the field:

function mascara(o, f) {
  v_obj = o
  v_fun = f
  setTimeout("execmascara()", 1)
}

function execmascara() {
  v_obj.value = v_fun(v_obj.value)
}

function mdata(v) { // máscara para o user digitar sempre dd/mm/aaaa
  v = v.replace(/\D/g, ""); //Remove tudo o que não é dígito
  v = v.replace(/(\d{2})(\d)/, "$1/$2");
  v = v.replace(/(\d{2})(\d)/, "$1/$2");

  v = v.replace(/(\d{2})(\d{2})$/, "$1$2");
  return v;
}

Answer 1

Missed putting this.value in the onblur, thus:

onblur="calcularIdade(this.value)"

This will send the value of the field to the function, not the element itself, causing the error in the split.

Change the onkeypress for onkeyup in order to return the length field correctly while being typed.

I added a if in function mascara() which will call the function that calculates the age once the field is 10 characters long.

function mascara(o, f) {
  v_obj = o
  v_fun = f
  setTimeout("execmascara()", 1)
  
  // linhas adicionadas
  if(v_obj.value.length == 10){
     calcularIdade(v_obj.value);
  }
}

function execmascara() {
  v_obj.value = v_fun(v_obj.value)
}

function mdata(v) { // máscara para o user digitar sempre dd/mm/aaaa
  v = v.replace(/\D/g, ""); //Remove tudo o que não é dígito
  v = v.replace(/(\d{2})(\d)/, "$1/$2");
  v = v.replace(/(\d{2})(\d)/, "$1/$2");

  v = v.replace(/(\d{2})(\d{2})$/, "$1$2");
  return v;
}


function calcularIdade(aniversario) {
    var nascimento = aniversario.split("/");
    var dataNascimento = new Date(parseInt(nascimento[2], 10),
      parseInt(nascimento[1], 10) - 1,
      parseInt(nascimento[0], 10));

    var diferenca = Date.now() - dataNascimento.getTime();
    var idade = new Date(diferenca);

    return console.log(Math.abs(idade.getUTCFullYear() - 1970));
  }

<input type="text" id="nascimento" onkeyup="mascara(this,mdata)" maxlength="10" name="nascimento" onblur="calcularIdade(this.value)" runat="server" class="form-control" />