Javascript regular expression does not work within the form tag

Asked

Viewed 111 times

0

function celular(){var celular=document.getElementById("celular").value;
var ExpReg = /^[0-9]{11}$/;
if(ExpReg.test(celular)){
alert("Sim passou no teste.");
return true;
}
alert("Não passou no teste.");
return false;}

funciona:<input type="text" id="celular" onkeyup="celular();">
não funciona:<form><input type="text" id="celular" onkeyup="celular();"></form>
  • Dude, when you want to access the function by submitting a form, put onsubmit and not onClick. Because in onClick it performs the function, but will reload the screen, got it? One more thing, the title of your question is very vague. Try to specify more your doubt.

2 answers

3


I believe its purpose was to check the field before the form was sent.

Note that you are working with events. Events relate to who fired it.

In this case the correct use of the onkeyup input, as it is triggering the event each time "a tile comes back" from an insert.

But he has nothing to do with sending form for this it is necessary to use another event the onsubmit.

Remembering that it relates to the element that fired it, in this way it would not be possible to use the input event in the form, because the this should be the one of input and not of form.

In your case just do:

function _celular(){
    var celular = document.getElementById("celular").value;
    var ExpReg = /^[0-9]{11}$/;
    if (ExpReg.test(celular)) {
        alert("Sim passou no teste.");
        return true;
    }
    alert("Não passou no teste.");
    return false;
}
<form onsubmit="_celular()">
  <input type="text" id="celular" onkeyup="_celular()">
  <input type="submit" value="enviar">
</form>

'Cause you don’t wear any tris but a search for element.

  • I still have no score to comment on answers. Just complementing what @Guilherme said earlier, the event you’re looking for is onchange. The event onkeyup is activated whenever you release a key from the keyboard, but you want to check only after the user has entered the whole number, correct? Or, if you prefer, when you click the SUBMIT button, use the event property onclick: <input type="submit" value="enviar" onclick="_celular()">

0

Try something like that:

  // não use o mesmo nome da função, na variavel 
  // ex: var celular=document.getElementById("celular").value; 
  // function celular() {...}

  var minhasRegex = {
    telefone: /^((\+55)?([1-9]{2})([\d]{8}))$/,
    celular: /^(\+55)?([1-9]{2})([\d]{8,9})$/,
  };

function validaCelular(evento) {
  var texto = evento.target.value;

  if (minhasRegex.celular.test(texto)) {
    alert('Sim passou no teste.');
    return true;
  }
  alert('Não passou no teste.');
  return false;
};

var celularInput = document.getElementById('celular');

// Ou valida quando usuario tirar o foco do elemento
celularInput.addEventListener('blur', validaCelular);

// OU valida a cada keyup: 
celularInput.addEventListener('keyup', validaCelular);

Browser other questions tagged

You are not signed in. Login or sign up in order to post.