Good, I have the following code.
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>It is assumed that when the person does not enter anything in the field of the plate, a cloud should appear with the message that I put, but when testing the html without the script, I realize that the required label is not working and I really do not know why?
I would really appreciate your help