Buenas tengo el siguiente codigo.
window.onload = function () {
var placa = document.getElementById('placa');
placa.onblur = Validar;
}
function Validar(){
var placa = document.getElementById('placa');
placa.addEventListener('input', function(evt) {
this.setCustomValidity('');
});
placa.addEventListener('invalid', function(evt) {
// Required
if (this.validity.valueMissing) {
this.setCustomValidity('Por favor digitar la placa');
}
});
}
<!DOCTYPE html>
<html lang = "es">
<head>
<meta charset = "UTF-8">
<title></title>
<link rel="stylesheet" href="../css/plantilla_gral.css">
<script src = "../js/jquery-3.2.1.min.js"></script>
<script src = "../js/marcas.js"></script>
</head>
<body>
<div class="contenedor">
<form method= "post" class = "form-registro">
<h2>Registrar nuevo propietario</h2>
<div class ="contenedor-input">
<input type = "text" id = "placa" name = "placa" placeholder = "Ingresar placa" class = "input-100" required />
class = "btn-enviar" id = "btn-enviar"/>
</div>
</form>
</div>
</body>
</html>
Se supone que cuando la persona no digita nada en el campo de la placa debe aparecer una nube con el mensaje que le puse, pero al probar el html sin el script me doy cuenta de que la etiqueta de required no esta funcionando y la verdad no se por que?
agradecería mucho su ayuda