Capítulo 6

Método setCustomValidity() para validação de input

JavaScript

<script>
var padrao = /^\([0-9]{2}\)[\s][0-9]{4}-[0-9]{4}$/;
function validar(input) {
    if (!padrao.test(input.value)) {
        // Mensagem de erro
        input.setCustomValidity('O número (' + input.value + ') não está no formato requerido. Por favor corrija.');
    } else {
        // Limpa mensagem de erro
        input.setCustomValidity('');
    }
    document.getElementById('msg-erro').innerHTML = input.validationMessage;
}
</script>

HTML

<form>
	<p><label>Telefone: <input required name="tel" onblur="validar(this)"></label> (xx) xxxx-xxxx</p>
		<div id="msg-erro" style="color:red;"></div>
	<input type="submit" value="OK">
</form>