-1

preciso fazer uma validação. É o seguinte: O campo só pode aceitar nomes normais, tipo:

João Pedro, Mateus Rodrigues etc.

Nomes como Fabio123 ou outros caracteres especiais não podem ser aceitos. Alguém pode me ajudar, não consegui fazer.

0

2 Respostas 2

2

Use expressão regular: [A-Za-záàâãéèêíïóôõöúçñÁÀÂÃÉÈÍÏÓÔÕÖÚÇÑ ]

JQuery keyup function

 jQuery('.nome').keyup(function () { 
   this.value = this.value.replace(/[^A-Za-záàâãéèêíïóôõöúçñÁÀÂÃÉÈÍÏÓÔÕÖÚÇÑ ]/g,'');
 });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<input type="text" class="nome" value="" />

Javascript evento onclick

    var re = /^[A-Za-záàâãéèêíïóôõöúçñÁÀÂÃÉÈÍÏÓÔÕÖÚÇÑ ]+$/  
      function testInfo(nomeInput){  
        var OK = re.exec(nomeInput.value);  
        if (!OK)  
          window.alert(document.getElementById("nome").value + " não é um nome válido!");  
        else
          window.alert("Seu nome " + OK[0] + " é válido");  
      }
  
    
  <input id="nome">
      <button onclick="testInfo(document.getElementById('nome'));">Check</button>

Javascript evento onkeyup

	function myFunction(nomeInput) {
    	var el = document.getElementById("nome");
    	var str = el.value;
    	var res = str.replace(/[^A-Za-záàâãéèêíïóôõöúçñÁÀÂÃÉÈÍÏÓÔÕÖÚÇÑ ]/g, "");
   	 	el.value = res;
	}
    <input type="text" class="nome" id="nome" value="" onkeyup="myFunction(document.getElementById('nome'));">

0

A resposta do amigo acima permite que você digite um caractere indesejado (números e símbolos) e depois ele se apaga, eu sinceramente não gosto desse padrão.. fica parecendo um BUG rs

Segue abaixo uma função em Jquery que não deixa com que o usuário digite números ou símbolos, permitindo somente letras maiúsculas, letras minúsculas, espaços e acentos ;)

jQuery(function($) {
    document.querySelector("input#nome").addEventListener("input", function(){
        const allowedCharacters="azertyuiopqsdfghjklmwxcvbnAZERTYUIOPQSDFGHJKLMWXCVBN ";
        let newValue="";
        this.value.split("").forEach(function(char){
            if(in_array(char, allowedCharacters.split(""))) newValue+=char;
        });
        this.value=newValue;
    });
    function in_array(elem, array){
        let isIn=false;
        for(var i=0;i<array.length;i++){
            if(elem==array[i]) isIn=true;
        }
        return isIn;
    }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="nome" class="form-control" name="nome" placeholder="Insira Somente Letras">

Utilizando um placeholder com "Insira Somente Letras" você deixa claro para o usuário o porque ele não consegue inserir outros caracteres..

Espero que possa ajudar alguem =]

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .